Chart Skill

A table of numbers hides the story; a chart shows it. This skill turns data into a clean, correctly-typed chart — a trend as a line, a comparison as bars, a composition as a pie/doughnut — emitted as a small JSON spec inside a ```chart block that renders live in the playground (and exports as PNG).

Required Inputs

Ask for these only if they aren't already provided:

• The data — the numbers, with their labels/categories (paste a table, list, or metrics).
• What you want to show — a trend over time, a comparison between things, or parts of a whole. This decides the chart type.
• Series — one metric or several (e.g. revenue and churn over the same months).
• Title (optional) — what the chart is about.

If the data implies the wrong chart type for the goal, pick the right type and say why.

Output Format

[What the chart shows]

A one-line read — the takeaway the chart makes obvious.

{
  "type": "line",
  "title": "MRR vs. churned MRR (2026)",
  "labels": ["Jan", "Feb", "Mar", "Apr", "May", "Jun"],
  "series": [
    { "name": "MRR ($k)", "data": [120, 138, 151, 167, 180, 201] },
    { "name": "Churned ($k)", "data": [8, 9, 7, 11, 9, 8] }
  ]
}

Notes (optional) — caveats, the source of the numbers, or what a follow-up chart would show.

Chart Spec Rules (so it renders)

• Emit a single ```chart block containing valid JSON (double-quoted keys/strings, no trailing commas, no comments).
• type: "bar", , , , or .