JSFiddle - React, Tailwind, and code Playground

by Nihar Raote

HTML

<div class="animated"></div>

CSS

.animated {
  background-color: red;
  width: 200px;
  height: 120px;
  border-radius: 25px;
  position: relative;
  left: 30%;
  top: 20px;
  animation: flip 1.5s ease-out infinite;
}

@keyframes flip {
  0% {
    transform: rotateY(0deg);
  }
  50% {
    transform: rotateY(90deg);
  }
  100% {
    transform: rotateY(0deg);
  }
}