Metric Card
The dashboard KPI card: a label, a big value and a coloured trend delta (up = success, down = error), with an optional leading featured icon and a chart slot. Composes card and featured-icon.
bunx shadcn@latest add @nx-ui/metric-cardKPI grid
The staple dashboard layout — a row of metric cards, each with a leading featured icon and a trend delta against the previous period.
Diverted from landfill
1,284 t
Active rounds
47
Contamination rate
3.2%
Inverted trend colour
Sometimes a rise is bad news. Pass invertColor so a rising cost reads red and a falling one reads green.
Fuel cost per round
£38.10
Cost per tonne
£12.40
Chart variant
A sparkline in the chart slot shows the shape of the trend, not just its direction. Any node works here — a small nx-ui chart, or a plain SVG.
Intake volume
8,940 t
Rejected loads
112
API reference
Exported parts and their props, extracted from the component source.