Wick Charts
import { Sparkline } from '@wick-charts/react';
 
<Sparkline data={data} />

A self-contained miniature chart for tables, KPIs, and dashboards. Renders without any of the chrome (<YAxis>, <TimeAxis>, etc.) and includes a lightweight value badge.

A self-contained miniature chart for tables, KPIs, and dashboards. Renders without any of the chrome (<YAxis>, <TimeAxis>, etc.) and includes a lightweight value badge.

Props

dataTimePoint[]

Data points plotted by the sparkline. A flat TimePoint[] — the sparkline only ever shows one tiny line/bar.

timenumber

Unix milliseconds.

valuenumber

Y-axis value at this point. Drives the line height / bar height.

flow?{ capacity: number }

Streaming-window mode: viewport is fixed at capacity bars wide and stays anchored at the time of the first data point until the window fills. New ticks flow into the empty right side instead of expanding the visible range. Pass at least one seed point in data so the initial window has a time anchor.

themeChartTheme

Visual theme. Drives series colour, background gradient, and the change-direction colours used in the value block.

variant?SparklineVariant

'line' (default) or 'bar'

valuePosition?SparklineValuePosition

Where to show the value label

formatValue?(value: number) => string

Custom format for the value

label?string

Label text above the value

sublabel?string

Sublabel text below the value (defaults to the change %)

color?string

Line/bar color override (defaults to theme)

negativeColor?string

Secondary color for negative bars

area?{ visible: boolean; }

Show area fill under line

areaFill?Deprecatedboolean
width?number

Chart width (default: 140)

height?number

Overall height (default: 48)

strokeWidth?number

Stroke width in CSS pixels (default: 1.5)

gradient?boolean

Show chart background gradient (default: true)

style?CSSProperties

Container style override