Sparkline

Tiny trend primitive rendered as line or bar SVG.

Sparklines show trend shape, not detailed analysis. Keep axes and legends in the surrounding data surface.

Playground

Props in the URL.

Controls update query params directly, so every primitive state can be linked, rendered, and screenshotted deterministically.

Loading playground.

States

Every state maps to the same render route through the `state` query param.

Line

Line trend.

Area

Line with soft area and endpoint.

Bar

Bar density.

Dot

Dot distribution.

Volatile

High variance trend.

Props

Name	Type	Default	Description
`values *`	`readonly number[]`	-	Series values normalized into the SVG viewport.
`variant`	`'line' \| 'bar' \| 'dot'`	`line`	Sparkline mark type.
`tone`	`'sky' \| 'neutral' \| 'terminal' \| 'error'`	`sky`	Line, endpoint, area, and bar color.
`area`	`boolean`	`false`	Adds a soft area fill under a line sparkline.
`showEndpoint`	`boolean`	`true`	Shows the last value dot for line sparklines.