KQ-012 · READOUT
Readout
Numbers with momentum — per-digit vertical rolls with real carry propagation, so 199 → 200 visibly carries right to left.
KQ-012 · READOUT
p95 latency · ms
42.642.6
requests / sec12,41812,418
Install
One command — the source lands in your repo. Or copy it from the Code tab.
$ pnpm dlx shadcn@latest add @kinetiq/readout
Props
| Prop | Type | Default | Description |
|---|---|---|---|
| value | number | — | The numeric value to display. |
| format | (value: number) => string | toLocaleString | Formats the value; non-digit characters render as static cells. |
| size | "sm" | "md" | "lg" | "xl" | "md" | Type scale. |
| rollOn | "any" | "increase" | "any" | With "increase", decreases swap instantly — right for latency-style metrics. |
| delta | { value: string; direction: "up" | "down" } | — | Change badge that flips up when the value moves. |