Claude, Graphing.

The video asks whether Claude already knows how to make a good chart. It shows that Claude reads a charting kit first, which sets defaults for color, labels and titles, and a render-and-look step before the chart is handed over.

3:10 video4 min readWatch on YouTube

The video asks whether Claude already knows how to make a good chart, and answers that it is told what to check in a kit it reads before drawing anything. It then lists what that kit contains: a handful of building blocks, a few optional data helpers, a four-step workflow and a set of judgment defaults.

Five building blocks

The kit has five primitives. The theme sets matplotlib rc parameters and returns resolved colors, and its key feature is that foreground colors are derived from the background luminance. Pass a dark background and the chart comes out correctly dark without extra work. The palette builds colors from a base hex value, cycles a list, or falls back to the series defaults. Finish adds the typographic frame, a left-aligned bold title and a muted provenance caption. Save writes PNG, SVG or both and returns the paths. Write HTML produces a self-contained interactive page by inlining React, React DOM and Recharts from a local third-party directory, so the file opens offline with no CDN dependency.

One practical detail: the absolute path to the graphing scripts directory must go into sys.path, not a relative path, because the working directory is the user's project.

Three optional data helpers

Each helper targets a specific gotcha, and all three are optional. One fills calendar gaps in a time series with zeros, but should be skipped when zeros would be a lie because the data is sparsely sampled rather than absent. The rolling mean is trailing, so early points average whatever exists so far, and it should not be centered. The third gives a lower bound for bar charts on log scales, where a value of zero would otherwise sit at the axis minimum.

A four-step workflow

The steps are to look at the data and decide what it deserves, infer colors from context, write the script, and render and look at the result before handing it over. Context for colors can come from a Tailwind config, CSS variables, brand guidelines, or the semantic meaning of the data. The render step is explicit: check that labels are legible, nothing overlaps, colors are distinguishable and the story of the data is visible, then fix and re-render until it is right.

Judgment defaults with permission to deviate

The kit gives five defaults, and Claude may depart from them when the data argues for it.

  • Rotate x labels only when they would otherwise collide; short labels stay horizontal.
  • Cap bar width when there are only a few categories.
  • Label bars with their values when there are roughly a dozen or fewer.
  • Rank categorical bars by value unless the categories have a natural order.
  • Write a title that states what the chart shows, not the chart type or the column name.

Legends appear only when there is more than one series, and annotations should mark what matters, such as a deploy line, a threshold, the peak or the anomaly. An annotation the reader did not need is clutter.

Plainly documented versus easy to miss

The kit does not guarantee a right chart every time. Where it spells something out plainly, such as the first-step judgment call, colors that adapt to the background, or an offline file that just works, Claude follows it and skips the mistake. Where something is a placeholder string swapped by hand, or one phrase covering an edge case, Claude can still err, as a person skimming the same page might. A charting kit does not give Claude good taste; it gives it defaults and a few marked sharp edges.

Key takeaways

  • Claude reads a charting kit before it draws; it is not assumed to know what a good chart needs.
  • Foreground colors derive from background luminance, so dark backgrounds work automatically.
  • The data helpers are optional, and the zero-fill helper should be skipped for sparsely sampled data.
  • The rolling mean is trailing and should not be centered.
  • The workflow ends with rendering and looking at the chart, then fixing and re-rendering.
  • Titles state what the chart shows, and annotations should only mark what the reader needs.
  • Claude only dodges the sharp edges the kit actually marks.

Try it yourself

Give Claude a dataset you have never charted before, ideally one with a real gap in it or no obvious color to use. Before it writes any chart code, ask what it will check in the data first and where the colors are coming from. Then have it render the result, look at the PNG itself, and say what it would fix before handing it to you.

Chapters

  1. 0:00Cold open — does Claude already know how to make a good chart?
  2. 0:10Anatomy — chartkit primitives + data helpers
  3. 1:19Design — four-step workflow + judgement defaults
  4. 2:15Both directions — documented plainly vs. easy to miss
  5. 2:37Carry-out
  6. 2:47Your turn
  7. 3:06Outro CTA
Full transcript(auto-generated, with timestamps)

Cold open — does Claude already know how to make a good chart?

[0:00]Someone assumed Claude already knows how to make a good chart. Not quite. It gets told what to check in a kit it reads before drawing. Here's what that kit actually spells out. The kit has five

Anatomy — chartkit primitives + data helpers

[0:10]Primitives and three data helpers. Theme sets matplotlib RC params and returns resolved colors. The key field is that foreground colors derive from background luminance. Pass a dark background and you get a correct dark chart automatically. Pallet builds in colors from a base hex, cycles a list, or falls back to the series defaults. Finish adds the typographic frame, left aligned bold title, muted provenance caption. Save writes PNG, SVG, or both and returns paths. Write HTML produces a self-contained interactive page by inlining React, React DOM, React as in recharts from a local third-party directory. The file opens offline with no CD independency. The three data helpers address specific gotchas. Zero filled days fills calendar gaps in a time series, but skip it when zeros would be a lie because the data is sparsely sampled, not absent. Rolling mean is trailing and early points average whatever exists so far. Do not center it. Log floor gives a lower bound for bar charts on log scales where value equals the axis minimum. All three are optional. Use them only when they fit. The absolute path to graphing scripts directory must go into sys.path, not a relative path, because the working directory is the user's project. The

Design — four-step workflow + judgement defaults

[1:19]Four steps are look at the data and decide what it deserves, infer colors from context, Tailwind config, CSS variables, brand guidelines, and semantic meaning. Write the script and render and look at the result before handing it over. The render and look step is explicit. Check labels for legibility, nothing overlapping, colors distinguishable, the story of the data visible. Fix and re-render until it is right. The judgment section gives defaults with explicit permission to deviate when the data argues for it. Five defaults worth knowing. Rotate X labels only when they would otherwise collide. Short labels stay horizontal. Cap bar width when there are a few categories. Label bars with their values when there are roughly a dozen or fewer. Rank categorical bars by value unless the categories have a natural order. A title states what the chart shows, not the chart type. Not the column name. Legends only when there is more than one series. Annotate the chart with what matters. A deploy line, a threshold, the peak, the anomaly. An annotation the reader did not need is clutter.

Both directions — documented plainly vs. easy to miss

[2:15]So, does having this kit mean Claude always makes the right chart? Not exactly. Where the kit spells something out plainly, the first step judgment call, colors that adapt to the background, an offline file that just works, Claude follows it and skips the mistake entirely. Where it's a placeholder string swapped by hand or one phrase covering an edge case, Claude can still get it wrong the same way a person skimming the same page would. A charting kit doesn't give

Carry-out

[2:37]Claude good taste. It gives Claude judgment defaults to start from and a few sharp edges marked and Claude only dodges the edges the kit actually marks.

Your turn

[2:47]Your turn. Here's the prompt. Read it with me. Give Claude a data set you've never charted before, something with a real gap in it or no obvious color to reach for. Before it writes any chart code, ask what it's going to check in the data first and where the colors are coming from. Then have it render the result, look at the PNG itself and say what it would fix before handing it to you. Claude graphing. Lay 'em in for bear.

More from Claude Basics

Humanitarians AI Lyrical Literacy Project