JSFiddle - React, Tailwind, and code Playground

by Gereltod Gotsbayar

HTML

<div class="square">img</div>

CSS

div.square {
    margin: 40px;
    width: 50px;
    height: 50px;
    background-color: black;
    color: white;
    
    -webkit-animation-name: rotateThis;
    -webkit-animation-duration: 5s;
    -webkit-animation-iteration-count: 1;
    -webkit-animation-timing-function: ease-in-out;
}

@-webkit-keyframes rotateThis {
    60% {-webkit-transform: scale(2); }
    80% {-webkit-transform: scale(2) rotateZ(180deg); }
    100% {-webkit-transform: scale(2) rotateZ(360deg); }
}