JSFiddle - React, Tailwind, and code Playground
HTML
<div id="spinme"></div>
<div id="spinme"></div>
CSS
@keyframes spin{
0% {transform:rotateZ(0deg);}
50% {transform:rotateZ(360deg);border-radius:60%;}
100%{transform:rotateZ(720deg);}
}
#spinme{
-webkit-transform: translate3d(0, 0, 0);
-moz-transform: translate3d(0, 0, 0);
-ms-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
display:inline-block;
position:relative;
left:0;
top:0;
margin:0.2rem;
width:0.8rem;
height:0.8rem;
border:0.2rem solid black;
border-radius:0%;
outline: 1px solid rgba(0,0,0,0);
animation: spin infinite 4s;
}
#spinme:nth-of-type(2){
outline: 1px solid transparent;
}