JSFiddle - React, Tailwind, and code Playground

by Sam Westwood

HTML

<div> <img class="element-animation" src="https://i.imgur.com/vKB9hmK.png" alt="panda"> </div>

CSS

.element-animation {
    -webkit-animation: in 1s;
}

.element-animation:hover {
    -webkit-animation: out 1s;
}

@-webkit-keyframes in {
    from   { -webkit-transform: rotate(0deg); }
    to { -webkit-transform: rotate(360deg);}
}

@-webkit-keyframes out {
    0%   { -webkit-transform: rotate(360deg); }
    100% { -webkit-transform: rotate(0deg); }
}