stat
Numeric metric display with optional trend indicator. Use inside a card() or a flex/grid container for dashboard layouts.
Total users
12,483
+8.2%
Bounce rate
24%
−3.1%
Avg. session
4m 12s
stat({ label: 'Total users', value: '12,483', change: '+8.2%', trend: 'up' })
stat({ label: 'Bounce rate', value: '24%', change: '−3.1%', trend: 'down' })
stat({ label: 'Avg. session', value: '4m 12s' })The center prop centre-aligns the value, label, and change — useful in grids or dashboard cards.
Total users
12,483
+8.2%
Bounce rate
24%
−3.1%
Avg. session
4m 12s
stat({ label: 'Total users', value: '12,483', change: '+8.2%', trend: 'up', center: true })| Prop | Type | Default | |
|---|---|---|---|
label | string | — | |
value | string | — | Formatted value string — e.g. "2.4k", "98%" |
change | string | — | Change label — e.g. "+12%", "−3" |
trend | string | neutral | up · down · neutral |
center | boolean | false | Centre-aligns value, label, and change |