Data Display
DataCard
A metric card displaying a key figure, label, trend indicator, and optional sparkline.
Preview:1280px
Total requests
2.4M+12.5% vs last week
Avg latency
142ms-8.3% vs last week
Error rate
0.12%+2.1% vs last week
Active agents
70% stable
Props
| Prop | Type | Default | Description |
|---|---|---|---|
| label | string | - | Metric label. |
| value | string | number | - | Primary metric value. |
| trend | number | - | Percentage change to display. |
| trendDirection | 'up' | 'down' | - | Direction of the trend arrow. |
| trendBad | boolean | false | Invert color so up-trend shows as red. |