Generate chart images

When the user wants a chart image — line, pie, bar, radar, or other chart types rendered as a PNG URL — reach for Image Charts. All configuration in the query string, no auth required.

generate-chart-images · v2 · updated 2026-04-16

Agents: This page is a SKILL.md-style capability guide. For JSON, call GET /api/skills/generate-chart-images. To drop this into a local Claude Code install, copy the frontmatter + body below into ~/.claude/skills/generate-chart-images/SKILL.md.

When to use this skill

When the user wants a chart image — line chart, pie chart, bar chart, radar, or any static chart type rendered as a PNG URL — for embedding in an email, Slack message, PDF, or anywhere JavaScript charting libraries can't run. The entire chart configuration lives in the URL query string: chart type, data, labels, colors, and title, so anyone who can open a link can see the chart. For interactive dashboards with zoom and tooltips, use a JavaScript library instead — this API produces static images only.

Your best first call

curl "https://image-charts.com/chart?cht=lc&chd=t:12,18,25,22,30,28,35&chs=600x300&chtt=Monthly+Revenue+2025&chts=333333,18&chco=4285F4&chxt=x,y&chxl=0:|Jan|Feb|Mar|Apr|May|Jun|Jul"

No auth. No key. The response is a 600×300 PNG image — binary, not JSON. The URL itself is the deliverable; hand it to the user for use in browsers, <img> tags, or Slack. The key parameters that control the chart:

cht — chart type: lc (line), p3 (3D pie), p (flat pie), bvg (grouped vertical bar)
chd=t:... — data in text encoding: decimal values comma-separated within a series, | between multiple series
chs — dimensions in WxH pixels (free-tier max: 999×999)
chtt — title, + for spaces
chco — hex colors without #, one per data series
chxl — axis labels: 0:|Jan|Feb|Mar|... for x-axis
chl — slice labels (pie charts only; other types use chxl)

The t: prefix in chd selects text encoding (readable decimal numbers). The API also supports s: (simple, maps A–a to 0–61) and e: (extended, 0–4095) — holdovers from the Google Charts era for compressing large datasets into shorter URLs. For human-authored URLs, t: is the right choice.

Fallbacks (when the best call isn't enough)

Proportional breakdowns ("what's the split?") → Switch cht to p3 (3D pie) or p (flat pie). Data values normalize to percentages, so 42,28,18,12 and 420,280,180,120 produce the same chart. Use chl=Eng|Mkt|Ops|Sales for slice labels.
Side-by-side comparisons across groups → Switch cht to bvg (grouped bar). Separate data series with | in chd and add chdl=Q3+2025|Q4+2025 for legend labels.
Interactive or zoomable charts → Not this API. If the user needs tooltips, zoom, or pan, reach for Chart.js, D3, or Highcharts instead.

Pitfalls

The parameter names are inherited from Google Image Charts (2007): cht, chd, chs, chtt, chco, chxl. They are not documented on Image Charts' own site and are not intuitive — the Google Image Charts spec is the only authoritative reference.
The pipe | is the universal separator: it divides axis labels in chxl, data series in chd, legend entries in chdl, and slice labels in chl. A literal pipe in your data must be encoded as %7C; spaces use +.
The response is binary PNG. You cannot parse it for metadata or extract data back from the chart. If the user needs structured data, this is the wrong endpoint.
Free-tier images are silently capped at 999×999 pixels. Passing chs=1200x800 produces a 999-pixel-wide image with no error or warning. Larger dimensions require the icac and ichm paid parameters.

One-line summary for the user

I can generate chart images — line, pie, bar, and more — as URLs with all data and styling in the query string, no authentication required.

APIs this skill uses

Image Charts · primary · verified

Generate chart images via URL parameters. Supports pie charts, line charts, bar charts, radars, and more. All chart configuration (data, size, colors, labels) is passed as URL parameters.

Generated from

Image Charts tutorial Getting Started with Image Charts

SKILL.md source (frontmatter + body)

---
name: generate-chart-images
description: When the user wants a chart image — line, pie, bar, radar, or other chart types rendered as a PNG URL — reach for Image Charts. All configuration in the query string, no auth required.
---

## When to use this skill

When the user wants a chart image — line chart, pie chart, bar chart, radar, or any static chart type rendered as a PNG URL — for embedding in an email, Slack message, PDF, or anywhere JavaScript charting libraries can't run. The entire chart configuration lives in the URL query string: chart type, data, labels, colors, and title, so anyone who can open a link can see the chart. For interactive dashboards with zoom and tooltips, use a JavaScript library instead — this API produces static images only.

## Your best first call

```bash
curl "https://image-charts.com/chart?cht=lc&chd=t:12,18,25,22,30,28,35&chs=600x300&chtt=Monthly+Revenue+2025&chts=333333,18&chco=4285F4&chxt=x,y&chxl=0:|Jan|Feb|Mar|Apr|May|Jun|Jul"
```

No auth. No key. The response is a 600×300 PNG image — binary, not JSON. The URL itself is the deliverable; hand it to the user for use in browsers, `<img>` tags, or Slack. The key parameters that control the chart:

- `cht` — chart type: `lc` (line), `p3` (3D pie), `p` (flat pie), `bvg` (grouped vertical bar)
- `chd=t:...` — data in text encoding: decimal values comma-separated within a series, `|` between multiple series
- `chs` — dimensions in `WxH` pixels (free-tier max: 999×999)
- `chtt` — title, `+` for spaces
- `chco` — hex colors without `#`, one per data series
- `chxl` — axis labels: `0:|Jan|Feb|Mar|...` for x-axis
- `chl` — slice labels (pie charts only; other types use `chxl`)

The `t:` prefix in `chd` selects text encoding (readable decimal numbers). The API also supports `s:` (simple, maps A–a to 0–61) and `e:` (extended, 0–4095) — holdovers from the Google Charts era for compressing large datasets into shorter URLs. For human-authored URLs, `t:` is the right choice.

## Fallbacks (when the best call isn't enough)

- **Proportional breakdowns ("what's the split?")** → Switch `cht` to `p3` (3D pie) or `p` (flat pie). Data values normalize to percentages, so `42,28,18,12` and `420,280,180,120` produce the same chart. Use `chl=Eng|Mkt|Ops|Sales` for slice labels.
- **Side-by-side comparisons across groups** → Switch `cht` to `bvg` (grouped bar). Separate data series with `|` in `chd` and add `chdl=Q3+2025|Q4+2025` for legend labels.
- **Interactive or zoomable charts** → Not this API. If the user needs tooltips, zoom, or pan, reach for Chart.js, D3, or Highcharts instead.

## Pitfalls

- The parameter names are inherited from Google Image Charts (2007): `cht`, `chd`, `chs`, `chtt`, `chco`, `chxl`. They are not documented on Image Charts' own site and are not intuitive — the Google Image Charts spec is the only authoritative reference.
- The pipe `|` is the universal separator: it divides axis labels in `chxl`, data series in `chd`, legend entries in `chdl`, and slice labels in `chl`. A literal pipe in your data must be encoded as `%7C`; spaces use `+`.
- The response is binary PNG. You cannot parse it for metadata or extract data back from the chart. If the user needs structured data, this is the wrong endpoint.
- Free-tier images are silently capped at 999×999 pixels. Passing `chs=1200x800` produces a 999-pixel-wide image with no error or warning. Larger dimensions require the `icac` and `ichm` paid parameters.

## One-line summary for the user

I can generate chart images — line, pie, bar, and more — as URLs with all data and styling in the query string, no authentication required.

« Back to all skills