Display
Sparkline
Inline mini line chart. Tiny SVG drawn from a values array — no axes or tooltips. For richer charts reach for the Chart family in packages/charts.
Examples
Inline next to a metric
Revenue $42K
<span>Revenue $42K <Sparkline values={[…]} /></span>Tones with area fill
<Sparkline values={[…]} tone="success" area />
<Sparkline values={[…]} tone="warn" area />
<Sparkline values={[…]} tone="danger" area />Props
| Prop | Type | Default | Description |
|---|---|---|---|
values | number[] | — | Y-coordinates; auto-scaled to min/max. |
width | number | 80 | SVG width in px. |
height | number | 24 | SVG height in px. |
tone | 'default' | 'success' | 'warn' | 'danger' | 'default' | Stroke / fill color. |
area | boolean | false | Fill below the line. |
Install
CLI
npx @a3tai/mittsu add sparkline