کافی است به المانی که می خواهید انیمیشن را روی آن اجرا کنید یک نام کلاس بدهید (مثلا: ninja)

حالا از کد زیر برای چرخش آن استفاده کنید:

.ninja{animation: myAnim 5s
linear 0s infinite
}

.ninja{transform-origin: center;
    display: inline-block;
}

@keyframes myAnim {
  100% {
     transform: rotate(360deg) translateX(10px) rotate(-360deg);
  }
  0% {
    transform: rotate(0deg) translateX(10px) rotate(0deg);
}
}

این کد برای چرخش در جهت عقربه های ساعت است، اگر خواستید خلاف عقربه های ساعت بچرخد، از کد زیر استفاده کنید:

.ninja2{animation: myAnim2 5s
linear 0s infinite
}

.ninja2{transform-origin: center;
    display: inline-block;
}

@keyframes myAnim2 {
     0% {
        transform: rotate(0deg) translateX(10px) rotate(0deg);
    }
    100% {
        transform: rotate(-360deg) translateX(10px) rotate(360deg);
    }
}