JSFiddle - React, Tailwind, and code Playground
by jakie8
HTML
<div id="load"></div>
CSS
body{
background:#888;
padding:20px;
}
#load{
/*content:'\003C\0073\0070\0061\006E\003E\003C\002F\0073\0070\0061\006E\003E';*/
width:300px;
height:300px;
position:relative;
border-radius:150px;
border:3px solid #555;
margin:0 auto;
box-shadow:0 1px 0 rgba(255,255,255,0.3);
}
@-webkit-keyframes loadSpin {
0% { -webkit-transform: rotate(0deg); }
100% { -webkit-transform: rotate(360deg); }
}
#load span{
border:3px solid #fefefe;
display:block;
width:300px;
height:300px;
border-color:#fefefe transparent transparent transparent;
border-radius:300px;
position:relative;
top: -3px;
left: -3px;
}
#load span{
-webkit-animation: loadSpin 3s infinite linear;
box-shadow:0 0 10px #fff;
}