Swap

Provides a new utility class spinner for circular animated spinners.

View Source 

Examples

Basic

<div class="flex gap-4">
    <div class="spinner"></div>
    <div class="spinner spinner-circle"></div>
    <svg class="spinner spinner-ring" viewBox="25 25 50 50" stroke-width="5">
        <circle cx="50" cy="50" r="20"></circle>
    </svg>
</div>

Custom

<div class="flex gap-4">
    <div class="spinner size-8 border-4 text-primary"></div>
    <div class="spinner spinner-circle size-8 border-4 text-primary"></div>
    <svg class="spinner spinner-ring size-8 text-primary" viewBox="25 25 50 50" stroke-width="5">
        <circle cx="50" cy="50" r="20"></circle>
    </svg>
</div>