Stat
A single metric: micro-label, a tabular headline and an optional delta. The value stays a string so you control the formatting.
Examples
Basic
Revenue
$12,400
+12% vs last month
Churn
2.4%
+0.3 pts
Active users
1,284
steady
Show code
<Stat label="Revenue" value="$12,400" delta="+12%" tone="positive" />Props
| Prop | Type | Default | Description |
|---|---|---|---|
label | string | — | The micro-label above the value. |
value | string | — | The headline number, preformatted. |
delta | string | — | Optional change line. |
tone | "positive" | "negative" | "neutral" | "neutral" | Colors the delta with the readable semantic text colors. |
Values use tabular numerals so a row of stats stays aligned. The delta is plain text — add arrows or signs in the value if you need them.