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 vote261 views1 answer
How to change button gradient
CSS
-1 vote275 views1 answer
Css background linear gradient transparent
CSS
0 vote270 views1 answer
Css select element by role
CSS
2 votes300 views1 answer
Table overflow not working
CSS
0 vote266 views1 answer
How to add default font css
CSS
0 vote272 views1 answer
Create an irregular shape div css
CSS
0 vote293 views1 answer
Bind 'fill' inside ':svg:path' with scss variables
CSS
0 vote288 views2 answers
Get element with href css
CSS
1 vote273 views1 answer
Css Use the correct background property to make the background image NOT scroll with the rest of the page.
CSS
3 votes301 views1 answer
Visibility transition css only on show
CSS