JD
Sparkline
A compact ApexCharts line micro-visualization for KPI cards, tables, and dashboard summaries.
Preview & Interactive Laboratory
Revenue velocity
Micro trend visualization
Support backlog
Micro trend visualization
Region activation
Micro trend visualization
Usage & Implementation
<Sparkline data={[18, 20, 21, 25, 27, 30, 36]} color="#7c3aed" height={40} />React / Tailwind
Granular Customization
1
Series
Provide short trend data optimized for small surfaces.
className={`data={[...]}`}2
Accent Color
Sets the line stroke color.
className={`color='#7c3aed'`}3
Frame Size
Adjust visual density for cards or table rows.
className={`height={32}`}API Reference (Props)
| Prop | Type | Default | Description |
|---|---|---|---|
| data | number[] | - | Series values rendered in sparkline mode. |
| color | string | '#7c3aed' | Line color. |
| height | number | 40 | Chart height. |