Progress

Visually represents progress or completion of a task. Updates dynamically to give users clear feedback on status.

Examples

Progress

Hint

Progress40%

Intervals

Progress

Sizes

Progress - sm
Progress - md
Progress - lg
Progress - xl

Props

NameDefaultType
value*
-number

Current progress value

size
"sm""sm" | "md" | "lg" | "xl"

Size of the progress bar: "sm" | "md" | "lg" | "xl"

label
""string

Optional text label displayed on the progress bar

hint
falseboolean

Whether to show a hint/tooltip for the progress value

intervals
falseboolean

Whether to show interval markers on the progress bar

intervalCount
6number

Number of intervals to display if `intervals` is true

Slots

SlotPayload
hint
-

Custom content for the hint area (usually displays the progress value). If not provided, defaults to showing `props.value` followed by `%`.