JSFiddle - React, Tailwind, and code Playground
HTML
<img src="https://dm.victoriassecret.com/imagefeatures/433x599/1267044869616/20140816-home-sub-yoga.jpg" />
CSS
@-webkit-keyframes spin-with-lighting {
0% {
-webkit-transform: rotateY(0);
-webkit-filter: brightness(1);
}
25% {
-webkit-transform: rotateY(90deg);
-webkit-filter: brightness(0.75);
}
50% {
-webkit-transform: rotateY(180deg);
-webkit-filter: brightness(1);
}
75% {
-webkit-transform: rotateY(270deg);
-webkit-filter: brightness(0.75);
}
100% {
-webkit-transform: rotateY(360deg);
-webkit-filter: brightness(1);
}
}
body {
padding: 10%;
-webkit-perspective: 1000px;
}
img {
width: 100%;
-webkit-animation: spin-with-lighting 4s linear infinite;
}