Sparkline
Inline mini-charts for tables, dashboards, and text. Compact data visualization without axes or labels.
Usage
import { Sparkline } from "@chartts/react"
<table>
<tr>
<td>Revenue</td>
<td>$48.2k</td>
<td><Sparkline data={[4,8,6,12,9,14]} /></td>
</tr>
</table>Props
| Prop | Type | Description |
|---|---|---|
| data | number[] | Array of numeric values |
| type | 'line' | 'bar' | 'area' | Sparkline variant. Default: 'line' |
| color | string | Stroke/fill color. Default: '#22d3ee' |
| width | number | Width in px. Default: 100 |
| height | number | Height in px. Default: 24 |
| showEndDot | boolean | Show dot on last point. Default: true |
Features
- Line, bar, and area variants
- Inline with text flow
- Responsive scaling
- End-point marker
- Min/max highlighting
- Band/range overlay
Other Charts
Line ChartBar ChartArea ChartPie / Donut ChartScatter ChartBubble ChartRadar ChartCandlestick ChartWaterfall ChartFunnel ChartGauge ChartStacked Bar ChartHorizontal Bar ChartDonut ChartHeatmapBox PlotHistogramTreemapPolar ChartRadial Bar ChartLollipop ChartBullet ChartDumbbell ChartCalendar ChartCombo ChartSankey Diagram