Primitives
Progress · Skeleton · Spinner
Linear progress bar (determinate + indeterminate), shimmer-skeletons, and an SVG-less CSS spinner in three sizes.
installnpx shadcn@latest add https://br-design-system2.vercel.app/r/br-primitives.json
Preview
Progress · 62%
Indeterminate
Spinners
Skeletons
import { Progress, Skeleton, Spinner } from "@/components/br/primitives";
<Progress value={62} />
<Progress indeterminate />
<Spinner size="sm" />
<Spinner />
<Spinner size="lg" />
<Skeleton w={44} h={44} r="50%" />
<Skeleton h={12} w="40%" />Props
| Prop | Type | Default | Description |
|---|---|---|---|
| Progress.value | number (0–100) | — | Width of the filled bar. |
| Progress.indeterminate | boolean | — | Animated shimmer. |
| Skeleton.w / h / r | string | number | — | width, height, border-radius. |
| Spinner.size | "sm" | "lg" | — | Defaults to 28px. |