DUCircularProgress
DataCircular progress ring.
import { DUCircularProgress } from 'deri-ui';Live preview
72%
Completetypescript
<DUCircularProgress value={76} label="Complete" />Props
| Prop | Type | Default | Description |
|---|---|---|---|
| value | number | — | 0–100 |
| size / stroke | number | — | Geometry |
| tone | string | — | Stroke color |
Usage
import { DUCircularProgress } from 'deri-ui';
<DUCircularProgress value={76} label="Complete" />Customize with className, radius, and Tailwind utilities. Theme tokens come from deri-ui/tailwind.preset.
Related
© 2026 Deri Ui. Developed by Deribew Shimelis. Copy and use the code freely in your projects.