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

1 vote218 views1 answer
Add border to input css
CSS
62 votes199 views3 answers
Css root variables
CSS
1 vote195 views1 answer
Css don't break elements
CSS
2 votes195 views1 answer
Transform:translateX()
CSS
11 votes173 views1 answer
90deg rotate to left css
CSS
0 vote202 views1 answer
.quform-sub-label
CSS
0 vote199 views1 answer
Css height animation
CSS
0 vote208 views1 answer
Delete files with help of .getignore
CSS
20 votes203 views2 answers
Div circle
CSS
0 vote170 views1 answer
Cs cart ty-no-image__icon ty-icon-image
CSS