Progress
Value relative to max
62%
Browse components
Progress
Determinate progress bar with optional label and percentage readout.
atoms 3 variants
Variants / states: smmdlg
Live example
Default usage you can copy and adapt.
Props
The props you are most likely to need, with types and defaults.
| Name | Type | Required | Default | Description |
|---|---|---|---|---|
| value | number | No | 0 | Current value |
| max | number | No | 100 | Maximum value |
| size | 'sm' | 'md' | 'lg' | No | md | Bar height |
| label | string | No | "" | Optional label |