Skip to content

Stat tiles

Row of headline KPI cards with a signed delta and up/down/good/bad framing.

Preview

Accessibility

  • Accessible name (role="img"/aria-label): Key metrics summary: revenue, active users, churn
  • A visually-hidden data table mirrors every value for screen readers: Revenue €48.2k (+12.4%); Active users 1,284 (+3.1%); Churn 2.1% (−0.4%, improving).

Do / Don’t

  • Do: Use --nx-success (text-role, not -solid) for text-on-surface deltas — it clears contrast in both themes.Don’t: Don't use colour alone for the direction — the sign (+/−) and word ("good"/"down") carry it too.

View in spec →