Data Chart

Render measured data as static charts. Two layers govern appearance: a design floor every chart keeps regardless of style - honest scales, one focal comparison, no chart junk - and an optional editorial preset (the openai.com-style tokens) for blog figures and hosts without their own style. When the requesting document or project has a house style, follow it; the floor still applies. PNG is the proof render and the default deliverable; keep the SVG alongside when the consumer wants vector.

Routing: chart or diagram?

Decide by the figure's content, not its name:

• Measured data - real numbers, many points, true scales (log axes, distributions, time series) - this skill.
• Structure - boxes, arrows, layers, pipelines, or a few illustrative values inside a larger schematic - the sibling technical-diagram skill. Use drawio-diagram only when native draw.io format is part of the request.
• Borderline (3-8 bars): real measurements that may change → this skill (the chart regenerates from data); a decorative sketch inside a diagram → technical-diagram.

Quick start

1. Pick the chart type from the reader's question with references/chart-selection.md - question → chart table, anti-patterns, and accessibility notes - before writing code.
2. Decide the style: the editorial preset below, or the embedding document's house style. For the preset, write a small script importing the style module scripts/editorial_mpl.py: ed.use() → plot with family colors → ed.mono_ticks / ed.axis_label → optional ed.header → ed.save(fig, stem) (writes stem.svg + stem.png). The module reads the vendored values from assets/editorial-tokens.json; scripts/example_chart.py is a working reference for a line chart and grouped bars (copy its subplots_adjust margins).
3. Run it. No system matplotlib is assumed - use uv run --with matplotlib python <script>.py (add other deps the same way). findfont warnings about Inter/IBM Plex Mono are expected on machines without those fonts; fallbacks carry the voice.
4. Run the pre-render checks, then look at the PNG before finishing: no clipped direct labels or tick text (widen margins, not the font), any required legend fits on one line, one accent focus, and no gridlines or unrequested supporting text.