ProgressCircle
Display progress with a circular indicator.
Examples
Basic
Preview
25%
65%
With label
Preview
40%
Progresso na trilha
82%
Progresso na trilha
Sizes and stroke width
Preview
55%
70%
90%
Custom colors
Preview
60%
90%
100%
API
| Prop | Type | Default | Description |
|---|---|---|---|
value | number | 0 | Progress percentage from 0 to 100. |
size | number | 96 | Size of the circle in pixels (width and height). |
strokeWidth | number | 2 | Stroke width for both track and indicator. |
indicatorClassName | string | — | Extra classes for the progress stroke. |
trackClassName | string | — | Extra classes for the track stroke. |
valueClassName | string | — | Extra classes for the value text. |
label | string | — | Optional label shown under the value. |
labelClassName | string | — | Extra classes for the label text. |
className | string | — | Wrapper className for the root element. |
...props | div props | — | Additional div props passed to the root element. |
Last updated on