JSFiddle - React, Tailwind, and code Playground

by Vaibhav Mehta

HTML

<div><img src="https://cloud.netlifyusercontent.com/assets/344dbf88-fdf9-42bb-adb4-46f01eedd629/5716ce84-56fb-4781-a101-98b5367aa2cc/akhil-labudubariki-profile.jpg" alt=""></div>

CSS

div {
  height: 100px;
  width: 100px;
  border: 2px solid tomato;
  border-radius: 50%;
  position: relative;
  overflow: hidden;
  animation: dancingLub 1s ease-in infinite;
  margin: 100px;
}

img {
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  width: 100%;
}

@keyframes dancingLub {
  50% {
    transform: rotateX(180deg) rotateY(360deg) scale(2);
  }
}