Spinner

Feedback

Loading indicators for indeterminate wait states. Use spinners when the duration of a process is unknown.

Import

import { Spinner, DotsSpinner } from "@/components/ui/spinner";

Usage

Spinner Sizes

Different sizes for various contexts

Loading...
Loading...
Loading...
Loading...

Dots Spinner

Alternative spinner style with animated dots

Loading...

With Label

Spinner with visible loading text

Loading...
Loading...

In Button

Spinner used inside a loading button

Full Page Loading

Centered spinner for page-level loading

Loading...

Loading content...

API Reference

PropTypeDefaultDescription
size"sm" | "md" | "lg" | "xl""md"Size of the spinner
labelstringAccessible label for screen readers

Related Components