Browse components
Loader
Five small, clean loaders in one component: a stretching arc spinner, squashy hopping dots, equalizer bars, a heartbeat pulse and bunching orbit dots.
Installation
npx shadcn@latest add @glint-ui/loaderFirst time using @glint-ui? Add the registry to components.json once, or install by URL: npx shadcn@latest add https://glint-ui-seven.vercel.app/r/loader.json
Usage
import { Loader } from "@/components/ui/loader";
<Loader variant="dots" size={24} />Props
| Prop | Type | Default | Description |
|---|---|---|---|
| variant | "spinner" | "dots" | "bars" | "pulse" | "orbit" | "spinner" | Which loader to draw. |
| size | number | 32 | Box size in px. |
| color | string | "currentColor" | Any CSS color; inherits the text color by default. |
| speed | number | 1 | Speed multiplier. |
| label | string | "Loading" | Screen reader text. |
| className | string | — | Extra classes for the root element. |