Spinner Animation

FREE

An animation of a spinner for elements

Demo

Spinner
Exclusive Launch 50% offspots left: 0 / 50
3D Cube - happy face3D Cube - Happy Face
$39.99

$19.99

Payment once and get lifetime access
Access to all animations
All updates
All animations
No subscriptions

Installation

1

Copy and paste the following code into your project.

Add the class animate-spinner to the element you want to animate.

global.css

@layer utilities {
    // START HERE ------------------------------------------------------------
     .animate-spinner {
        animation: spinner 1s linear infinite;
     }

     @keyframes spinner {
         from {
            transform: rotate(0deg);
         }
         to {
            transform: rotate(360deg);
         }
       }
    // END HERE ------------------------------------------------------------
}
2

Use the class animate-spinner to apply the animation to an element.


<div class="animate-spinner">
  <!-- Your content here -->
</div>
2

Start using the class animate-spinner