← All widgetsAnimatedAnimated & Data Viz

Sparkline

Compact inline trend line.

A small animated line chart with no axes — perfect for showing a trend inline next to a number.

type · sparkline
An animated visual primitive.

How to use it

Just ask for it in chat — the agent emits this widget and the shell renders it:

Try saying
a sparkline of my last 7 days of steps: 8000, 9500, 7200, 11000, 10400, 6800, 12000

Example

The agent returns this A2UI component (inside the components array of a /chat response):

sparkline.json
{
  "type": "sparkline",
  "values": [
    8000,
    9500,
    7200,
    11000,
    10400,
    6800,
    12000
  ],
  "color": "0xFF4CAF50",
  "height": 40
}

Properties

PropTypeDescription
valuesnumber[]Series of numbers to plot
colorcolorLine color
heightnumberHeight in px
widthnumberWidth in px

Browse the full Widget Index, the Widget Catalog, or learn the A2UI system behind it.