Spark Line
A tiny inline sparkline chart for embedding in dashboard cards and tables.
Preview
Import
import { SparkLine } from "@sigil-ui/components";Usage
<SparkLine data={[10, 25, 18, 32, 28, 45]} color="var(--s-primary)" />Props
| Prop | Type | Default | Description |
|---|---|---|---|
data | number[] | — | Array of numeric values (min 2) |
width | number | 120 | SVG width |
height | number | 32 | SVG height |
color | string | var(--s-primary) | Line and fill color |
filled | boolean | true | Fill area under line |
showEndDot | boolean | true | Show dot on the last data point |
Token integration
| CSS Variable | Purpose |
|---|---|
--s-primary | Default line and fill color |