Stats cards

A row of metric cards for dashboards.

Last updated

  • Revenue$48,200Up+12%
  • Active users3,912Up+4%
  • Churn1.8%Down-0.3%
  • Open tickets27
Show code
<StatsCards items={[{ label, value, change?, trend? }, …]} />

Add

npx @ava-ui/apogee add stats-cards

API

Prop Type Default Category Description
items { label, value, change?, trend? }[] — content Stat props.
label string 'Key metrics' content Landmark name.
layout 'row' 'row' layout One to four columns by viewport.
spacing 'small' layout

Accessibility

  • A labelled region (“Key metrics”) holding a list; numbers use tabular figures.