CircularProgress
SVG ring progress indicator with center label and indeterminate mode.
Installation
Examples
Sizes and colors
Four color variants with percentage labels.
72%
Primary45%
Warning90%
Success25%
DangerIndeterminate spinner
Animated ring for unknown progress.
API Reference
| Prop | Type | Default | Description |
|---|---|---|---|
| value | number | — | 0–100. Omit for indeterminate. |
| size | number | 48 | Diameter in px. |
| strokeWidth | number | 4 | Ring thickness in px. |
| color | 'primary'|'success'|'warning'|'danger' | 'primary' | Color variant. |
| label | string | — | Text displayed in the center. |
| indeterminate | boolean | false | Animated spinning ring. |