Stats Band

The accent-yellow-on-navy metric treatment in three idioms: stat-cards (a grid of navy metric cards), proof (one large stat beside a quote), and on-image (glassy stat cards over a hero image). stats drives all three.

$bunx shadcn@latest add @nx-ui/stats-band
Registry item
Installs withgrid-backdroputils

Stat cards

The default: a responsive grid of navy metric cards, each with its own grid backdrop and a big accent stat.

2.4M tMaterial tracked to date
99.98%Chain-of-custody completeness
14 daysMedian time to go live

Proof

variant=proof pairs the first stat with a quote on a single brand band — a compact, high-trust close.

40%Less time on compliance admin
The reporting that used to eat a day a week now takes minutes. My team got their Fridays back.
Operations Director, Meridian Recycling

On image

variant=on-image anchors glassy stat cards over a hero image (pass the image node). A left-fade navy gradient keeps the values readable.

2.4M t
Material tracked to date
99.98%
Chain-of-custody completeness
14 days
Median time to go live