JSFiddle - React, Tailwind, and code Playground
by Dawid Karwat
HTML
<div><div><div></div></div></div>
CSS
div{
display: block;
width: 232px;
height: 200px;
visibility: hidden;
overflow: hidden;
}
body>div{
transform: rotate(-120deg);
-webkit-animation: anim 5s linear infinite;
animation: anim 5s linear infinite;
}
div>div{
transform: rotate(60deg);
}
div>div>div{
background-color: steelblue;
visibility: visible;
}
div>div>div:hover{
background-color: darkorange;
}
@-webkit-keyframes anim{
from{ transform: rotate(0deg); }
to{ transform: rotate(360deg); }
}
@keyframes anim{
from{ transform: rotate(0deg); }
to{ transform: rotate(360deg); }
}