/CSS/How to add a pure css loading spinner

How to add a pure css loading spinner

.loader {
  width: 100%;
  margin: 50px auto;
  align-items: center;
  border: 7px solid #f3f3f3; /* Light grey */
  border-top: 7px solid #3498db; /* Blue */
  border-radius: 50%;
  width: 100px;
  height: 100px;
  animation: spin 2s linear infinite;
}

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

<div class="loader"></div>

Similar codes

0 vote127 views1 answer
Font-strech css
CSS
13 votes151 views2 answers
How to link a button to another page in css
CSS
3 votes117 views1 answer
Trash icon favicon
CSS
6 votes141 views3 answers
How to snap the scroll is css
CSS
2 votes146 views1 answer
Set table cellpadding and cellspacing in CSS
CSS
0 vote131 views1 answer
Create a specific form size and center in css
CSS
0 vote133 views1 answer
Restore mariadb from bz2 file cli
CSS
11 votes142 views6 answers
Warning: LF will be replaced by CRLF in
CSS
0 vote139 views1 answer
Select tag text align center
CSS
0 vote122 views1 answer
Css calc vw minus px
CSS