Progress
Displays an indicator showing the completion progress of a task
import { Progress } from "@plexui/ui/components/Progress";Examples
Overview
With label
3.2 / 4.8 MB
Controlled
API
Progress
| Prop | Type | Default | Description |
|---|---|---|---|
value | number | null | null | Current progress between 0 and max. Pass null for indeterminate. |
max | number | 100 | Maximum progress value |
className | string | — | Applied to the root <div> |
Built on Radix Progress — all Progress.Root props are forwarded.
Styling
Component tokens:
--progress-height— track height (defaults to4px)--progress-track-color— track background (defaults to--color-background-secondary-soft)--progress-indicator-color— fill color (defaults to--color-text)--progress-radius— corner radius (defaults to--radius-full)--progress-indeterminate-duration— sweep duration (defaults to1.5s)
Override at any scope to change the bar's look without subclassing.