1<x-lazy-loading size="xs" />
2<x-lazy-loading size="sm" />
3<x-lazy-loading size="md" />
4<x-lazy-loading size="lg" />

1<span class="loading loading-xs loading-spinner"></span>
2<span class="loading loading-sm loading-spinner"></span>
3<span class="loading loading-md loading-spinner"></span>
4<span class="loading loading-lg loading-spinner"></span>

1<x-lazy-loading type="dots" size="xs" />
2<x-lazy-loading type="dots" size="sm" />
3<x-lazy-loading type="dots" size="md" />
4<x-lazy-loading type="dots" size="lg" />

1<span class="loading loading-xs loading-dots"></span>
2<span class="loading loading-sm loading-dots"></span>
3<span class="loading loading-md loading-dots"></span>
4<span class="loading loading-lg loading-dots"></span>

1<x-lazy-loading type="ring" size="xs" />
2<x-lazy-loading type="ring" size="sm" />
3<x-lazy-loading type="ring" size="md" />
4<x-lazy-loading type="ring" size="lg" />

1<span class="loading loading-xs loading-ring"></span>
2<span class="loading loading-sm loading-ring"></span>
3<span class="loading loading-md loading-ring"></span>
4<span class="loading loading-lg loading-ring"></span>

1<x-lazy-loading type="ball" size="xs" />
2<x-lazy-loading type="ball" size="sm" />
3<x-lazy-loading type="ball" size="md" />
4<x-lazy-loading type="ball" size="lg" />

1<span class="loading loading-xs loading-ball"></span>
2<span class="loading loading-sm loading-ball"></span>
3<span class="loading loading-md loading-ball"></span>
4<span class="loading loading-lg loading-ball"></span>

1<x-lazy-loading type="bars" size="xs" />
2<x-lazy-loading type="bars" size="sm" />
3<x-lazy-loading type="bars" size="md" />
4<x-lazy-loading type="bars" size="lg" />

1<span class="loading loading-xs loading-bars"></span>
2<span class="loading loading-sm loading-bars"></span>
3<span class="loading loading-md loading-bars"></span>
4<span class="loading loading-lg loading-bars"></span>

1<x-lazy-loading type="infinity" size="xs" />
2<x-lazy-loading type="infinity" size="sm" />
3<x-lazy-loading type="infinity" size="md" />
4<x-lazy-loading type="infinity" size="lg" />

1<span class="loading loading-xs loading-infinity"></span>
2<span class="loading loading-sm loading-infinity"></span>
3<span class="loading loading-md loading-infinity"></span>
4<span class="loading loading-lg loading-infinity"></span>

1<x-lazy-loading color="primary" />
2<x-lazy-loading color="secondary" />
3<x-lazy-loading color="accent" />
4<x-lazy-loading color="neutral" />
5<x-lazy-loading color="info" />
6<x-lazy-loading color="success" />
7<x-lazy-loading color="warning" />
8<x-lazy-loading color="error" />

1<span class="loading loading-md loading-spinner text-primary"></span>
2<span class="loading loading-md loading-spinner text-secondary"></span>
3<span class="loading loading-md loading-spinner text-accent"></span>
4<span class="loading loading-md loading-spinner text-neutral"></span>
5<span class="loading loading-md loading-spinner text-info"></span>
6<span class="loading loading-md loading-spinner text-success"></span>
7<span class="loading loading-md loading-spinner text-warning"></span>
8<span class="loading loading-md loading-spinner text-error"></span>

1<x-lazy-loading xs />
2    <x-lazy-loading sm />
3    <x-lazy-loading md />
4    <x-lazy-loading lg />

1<span class="loading loading-xs loading-spinner"></span>
2    <span class="loading loading-sm loading-spinner"></span>
3    <span class="loading loading-md loading-spinner"></span>
4    <span class="loading loading-lg loading-spinner"></span>

1<x-lazy-loading primary />
2<x-lazy-loading secondary />
3<x-lazy-loading accent />
4<x-lazy-loading neutral />
5<x-lazy-loading info />
6<x-lazy-loading success />
7<x-lazy-loading warning />
8<x-lazy-loading error />

1<span class="loading loading-md loading-spinner text-primary"></span>
2<span class="loading loading-md loading-spinner text-secondary"></span>
3<span class="loading loading-md loading-spinner text-accent"></span>
4<span class="loading loading-md loading-spinner text-neutral"></span>
5<span class="loading loading-md loading-spinner text-info"></span>
6<span class="loading loading-md loading-spinner text-success"></span>
7<span class="loading loading-md loading-spinner text-warning"></span>
8<span class="loading loading-md loading-spinner text-error"></span>