Ring
Dots
Pulse
Bars
Installation
Usage
import { SpinnerRing, SpinnerDots, SpinnerPulse, SpinnerBars } from "@/components/pioneerui/spinner-variants"
export default function Loading() {
return <SpinnerRing size={24} className="text-primary" />
}Props (all spinners)
| Prop | Type | Default | Description |
|---|---|---|---|
size | number | 24–40 | Width/height in pixels |
className | string | undefined | Use for color via text-* |
Variants
| Component | Style |
|---|---|
SpinnerRing | SVG arc rotating animation |
SpinnerDots | Three pulsing dots |
SpinnerPulse | Single pulsing circle |
SpinnerBars | Four bars with wave animation |