Components • Stat

Stat

Large numeric highlights for impact surfaces — metrics, outcomes and KPIs. Combine in a 3–4 column grid for maximum effect.

Single stat

38%
Accident reduction
Median improvement across rollout cohorts.
<Stat value="38%" label="Accident reduction" caption="Median improvement across rollout cohorts." />

Grid

99.98%
Platform uptime
38%
Incident reduction
2.1k
Connected devices
<Stat /><Stat /><Stat />

Centered

1B+
Safety events processed
Since 2023 across all tenants combined.
<Stat align="center" ... />
Accessibility

How Stat works with assistive tech

Role
  • figure (recommended) with <figcaption>
Keyboard
  • not interactive
ARIA attributes
  • aria-label combining value + label for screen readers if visual order differs
Focus behavior
  • not-focusable

Large display number must have associated label text. Numeric-only is not accessible without context.