Progress
Determinate progress and capacity bars.
shadcn/ui · new-york-v4 · synced Aug 29, 2026shadcn/uinew-york-v4 · synced Aug 29, 2026
Installation
import { Progress } from "@aspyn-io/kit";Basic
With a value label
Compose a label and percentage above the bar.
Uploading…40%
Notes
- Inherited from shadcn/ui (Radix Progress). Announces progress to assistive tech; always provide an accessible name.
- To recolor the indicator, target it with a className selector, e.g. [&_[data-slot=progress-indicator]]:bg-chart-1.