Minimal rotating ring spinner with size variants.
xs
sm
md
lg
xl
Code
import { Spinner } from "@/components/ui/spinner"
export default function Example() {
return <Spinner />
}Installation
$npx particleui-cli add spinner
Usage
TSX
import { Spinner } from "@/components/ui/spinner"
export default function Example() {
return <Spinner />
}Examples
Sizes
Five size options from extra small to extra large.
TSX
import { Spinner } from "@/components/ui/spinner"
export default function Example() {
return (
<div className="flex items-center gap-6">
<Spinner size="xs" />
<Spinner size="sm" />
<Spinner size="md" />
<Spinner size="lg" />
<Spinner size="xl" />
</div>
)
}Props
| Prop | Type | Default | Required |
|---|---|---|---|
| size | "xs" | "sm" | "md" | "lg" | "xl" | "md" | no |
| className | string | — | no |
Details
Source filecomponents/ui/spinner.tsx
Typeui
Categoriesloaders, core
npm dependencies
Registry depscn
Claude skill—