JSFiddle - React, Tailwind, and code Playground

HTML

<div>
  <div>
    <div>
      <div>
        <div>
          <div>
            
          </div>
        </div>
      </div>
    </div>
  </div>
</div>

CSS

body {
  font-size: 80px;
}

div {
  background: url('https://lh5.ggpht.com/6G3wCupIFZy1NuiSYiGzPcPIj3PCyfB5wFb9wV-9tsayloSA_pVfb6TTWU1rgddo0A=w300') no-repeat;
  background-size: cover;
  border-radius: 500px;
  display: flex;
  justify-content: center;
  align-items: center;
  
  animation: rot 10s ease infinite;
}

div {                         width: 5em; height: 5em; transform: rotate(10deg); }
div > div {                   width: 4em; height: 4em; transform: rotate(12deg); }
div > div > div {             width: 3em; height: 3em; transform: rotate(14deg);  }
div > div > div > div {       width: 2em; height: 2em; transform: rotate(16deg);  }
div > div > div > div > {     width: 1em; height: 1em; transform: rotate(18deg); }

@keyframes rot {
  50% {
    transform: rotate(360deg);
  }
}