Loading

An animated CSS-only loading indicator. Renders a <span class="loading"> — no children needed. Six animation types, five sizes, and full color token support.

Types

Six animation styles.

Sizes

Five sizes — xs through xl.

Colors

Any DaisyUI color token via the color prop (maps to text-{color}).

All types colored

All six types at md size with primary color.

Inside a button

Use a small spinner inline with button text to show a pending state.

Full-page overlay

Center a large spinner over a content area using inset-0 flex items-center justify-center.