JSFiddle - React, Tailwind, and code Playground
by nosir
HTML
<div class="rotate-animation ">hello</div>
CSS
.rotate-animation{
width:100px;
height:100px;
background:red;
}
.rotate-animation {
-webkit-animation: rotate 2s linear 0s infinite normal;
-moz-animation: rotate 2s linear 0s infinite normal;
-o-animation: rotate 2s linear 0s infinite normal;
-ms-animation: rotate 2s linear 0s infinite normal;
animation: rotate 2s linear 0s infinite normal;
}
@-webkit-keyframes rotate {
from {
-webkit-transform: rotate(0deg);
}
to {
-webkit-transform: rotate(360deg);
}
}
@-moz-keyframes rotate {
from {
-moz-transform: rotate(0deg);
}
to {
-moz-transform: rotate(360deg);
}
}
@-o-keyframes rotate {
from {
-o-transform: rotate(0deg);
}
to {
-o-transform: rotate(360deg);
}
}
@-ms-keyframes rotate {
from {
-ms-transform: rotate(0deg);
}
to {
-ms-transform: rotate(360deg);
}
}
@keyframes rotate {
from {
transform: rotate(0deg);
}
to {
transform: rotate(360deg);
}
}