Create Sparkline

Everything you need to know to create the chart you want.

Overview

Sparklines are tiny line charts without axes or labels. They provide a quick glance at trend direction inside tables or KPI cards.

When to use it

  • Embedding trend hints inside dashboards or status cards.

  • Comparing multiple metrics in compact layouts.

  • Highlighting the shape of change rather than exact numbers.

Avoid sparklines when precise values or annotations are required; use full line charts instead.

Data requirements

  • Sequential data (time or ordered stages).

  • One series per sparkline; keep point counts reasonable (8–20).

  • Provide context elsewhere (title, KPI text) since sparklines are minimalist.

Style options available

Group
Control
Input type
Options
Description

Colors

Color palette

palette

β€”

Palette applied to series; sets the default colours for the chart.

General β†’ Sparkline

Type

select

line, spline

Selects the exact chart variant rendered for this series (line or spline).

General β†’ Sparkline

Line width

number

β€”

Thickness of the line or outline in pixels.

General β†’ Sparkline

Radius of dot

number

β€”

Radius of markers drawn on the line chart in pixels.

Title β†’ Chart title

Font name

text

β€”

Font family used for titles, labels, or legend text.

Title β†’ Chart title

Font style

text

β€”

Font weight or style (e.g., bold, italic).

Title β†’ Chart title

Font size

number

β€”

Font size in pixels for the selected text element.

Title β†’ Chart title

Font color

color

β€”

Colour of the text shown for this element.

Title β†’ Chart title

Margin bottom

number

β€”

Extra space below chart titles or subtitles in pixels.

Title β†’ Chart subtitle

Font name

text

β€”

Font family used for titles, labels, or legend text.

Title β†’ Chart subtitle

Font style

text

β€”

Font weight or style (e.g., bold, italic).

Title β†’ Chart subtitle

Font size

number

β€”

Font size in pixels for the selected text element.

Title β†’ Chart subtitle

Font color

color

β€”

Colour of the text shown for this element.

✨ Tip: Pair a sparkline with a headline metric and delta (β€œ+4.2% vs last month”) for immediate insight.

Have problems or want to improve this chart type?

Ping us via [email protected].

Last updated

Was this helpful?