JSFiddle - React, Tailwind, and code Playground

by Softlink

HTML

<div>
  <i></i>
  <i></i>
  <i></i>
  <i></i>
</div>

CSS

body {
    margin: 0;
    height: 100%;
    background:
	radial-gradient(black 15%, transparent 26%) 0 0,
	radial-gradient(black 15%, transparent 26%) 4px 4px;
	-moz-background-size: 8px 8px;
	background-size:8px 8px;
	background-color: rgba(0,0,0,.9);
}

i{
	position: absolute;
	top: 50%;
	left: 50%;
	width: 80px;
	height: 80px;
	margin: -40px 0 0 -40px;
	border-radius: 50%;
	box-shadow: 0 0 2px 1px rgba(255,255,255,.5);
}

i:nth-child(1){
	box-shadow: 0 0 2px 0 #FF4800;
	-webkit-animation: loader-hor 3s infinite;
	animation: loader-hor 3s infinite;
}
i:nth-child(2){
	box-shadow: 0 0 2px 0 #B200FF;
	-webkit-animation: loader-hor-right 3s infinite;
	animation: loader-hor-right 3s infinite;
}
i:nth-child(3){
	box-shadow: 0 0 2px 0 #F30A46;
	-webkit-animation: loader-vert 3s infinite;
	animation: loader-vert 3s infinite;
}
i:nth-child(4){
	box-shadow: 0 0 2px 0 #46ACFF;
	-webkit-animation: loader-vert-bottom 3s infinite;
	animation: loader-vert-bottom 3s infinite;
}

div{
	position: absolute;
	top: 50%;
	left: 50%;
	margin: -200px 0 0 -200px;
	width: 400px;
	height: 400px;
	-webkit-animation: rot 12s infinite linear;
	animation: rot 12s infinite linear;
	overflow: hidden;
}

@-webkit-keyframes 'loader-hor'{
	from{-webkit-transform: translate(0,0) scale3d(1, 1, 1);}
	50%{-webkit-transform: translate(150%,0%) scale3d(1.5, 1.5, 1.5);}
	to{-webkit-animation-play-state:paused;}
}
@-webkit-keyframes 'loader-hor-right'{
	from{-webkit-transform: translate(0,0) scale3d(1, 1, 1);}
	50%{-webkit-transform: translate(-150%,0%) scale3d(1.5, 1.5, 1.5);}
	to{-webkit-animation-play-state:paused;}
}
@-webkit-keyframes 'loader-vert'{
	from{-webkit-transform: translate(0,0) scale3d(1, 1, 1);}
	50%{-webkit-transform: translate(0%,150%) scale3d(1.5, 1.5, 1.5);}
	to{-webkit-animation-play-state:paused;
	}
}
@-webkit-keyframes 'loader-vert-bottom'{
	from{-webkit-transform: translate(0,0) scale3d(1, 1, 1);}
	50%{-webkit-transform: translate(0%,-150%) scale3d(1.5, 1.5,...