Css loader with gradient

.loader {
  background:linear-gradient(yellow, #e90b5a);
  /* Show only 10px from the border */
  -webkit-mask:radial-gradient(farthest-side,transparent calc(100% - 10px),#fff 0);
          mask:radial-gradient(farthest-side,transparent calc(100% - 10px),#fff 0);
  width: 100px;
  height: 100px;
  border-radius: 50%;  
  position: fixed;
  top: calc(50% - 50px);
  left: calc(50% - 50px);  
  animation: rot 2s linear infinite; 
}

@keyframes rot {
   100% { transform: rotate(360deg); }
}

body {
  background:linear-gradient(to right,grey,white)
}

Source: stackoverflow.com

Similar codes

4 votes219 views1 answer
Move button in CSS
CSS
0 vote182 views1 answer
Script for free code camp test
CSS
11 votes185 views3 answers
Filter for css white color
CSS
0 vote171 views1 answer
Repeating-linear-gradient
CSS
29 votes209 views6 answers
Input focus border
CSS
46 votes187 views2 answers
Customize scrollbar
CSS
32 votes197 views6 answers
Css animations
CSS
1 vote185 views1 answer
How to highlight input on focus with box shadow
CSS
3 votes193 views3 answers
How to change paragraph text color to orange - css
CSS
0 vote218 views1 answer
Set number word to new line html
CSS