Gauge
Radial 240° gauge with ok/warn/critical bands, spring fill or needle, ticks, rolling centre value, and a compact semicircle KPI variant.
Preview
Build runner 3
LiveAPI p95
Last 5 minInstall
Pro source requires Pebble Pro. Try the full preview above.
Props
| Prop | Type | Default | Description |
|---|---|---|---|
| value | number | — | Current value. |
| min | number | 0 | Lower bound. |
| max | number | 100 | Upper bound. |
| label | string | — | Accessible name and caption. |
| unit | string | — | Unit after the value. |
| bands | { to: number; tone: "ok" | "warn" | "critical"; label?: string }[] | [] | Threshold bands from min upwards; tint the track and colour the fill. |
| indicator | "fill" | "needle" | "fill" | Fill the arc or point a needle. |
| variant | "arc" | "semi" | "arc" | 240° gauge or compact 180° KPI semicircle. |
| size | number | 220 / 180 | Width in px. |
| ticks | number | 5 | Labelled ticks including both ends (arc). |
| format | Intl.NumberFormatOptions | — | Formats the value and ticks. |
Pro component
Try the full preview above. Editable source and build guides require Pebble Pro.