.box
.box
View Compiled
*
  box-sizing border-box

body
  display flex
  align-items center
  justify-content center
  gap 12.5vmin
  min-height 100vh
  
.box
  height 25vmin
  aspect-ratio 1 / 1
  background hsl(0, 90%, 75%)
  animation var(--name, box-one) 2s infinite ease-in-out
  
  &:nth-of-type(2)
    --name box-two
    background hsl(210, 90%, 75%)
    
 @keyframes box-one
   50%, 100%
     transform rotate(360deg)
@keyframes box-two
   0%, 50%
     transform rotate(0deg)
   100%
     transform rotate(360deg)
View Compiled
Run Pen

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.