A loading spinner with size variants and accessible labeling.

pnpm add @behivetech/atoms.spinner

This is the snapshot of v0.4.5, the current version, as recorded on 2026-11-10. The live page runs its examples →

Examples of v0.4.5 are shown as code; only the latest version runs live. Open the live examples →

Small Spinner
1const SmallSpinner = () => {
2 return <Spinner size="sm" />;
3};
4
5render(<SmallSpinner />);
Medium Spinner
1const MediumSpinner = () => {
2 return <Spinner size="md" />;
3};
4
5render(<MediumSpinner />);
Large Spinner
1const LargeSpinner = () => {
2 return <Spinner size="lg" />;
3};
4
5render(<LargeSpinner />);
Spinner With Custom Label
1const SpinnerWithCustomLabel = () => {
2 return <Spinner size="md" label="Saving changes" />;
3};
4
5render(<SpinnerWithCustomLabel />);