Claude skills for graphic design

Claude skill

Infographic brief skill

Lesson 10 of 11 in Claude skills for graphic design.

Checked against the makers' documentation on 17 October 2026.

Lesson

A skill that makes Claude plan and build an infographic the way an information designer does. It puts every figure you share into a fact sheet with its unit, base, period and source, then agrees one message with you, written as a sentence with a verb and a number. It chooses a chart for each block by the question a reader would ask, draws a wireframe in text with exact canvas and type sizes, and writes every word on the graphic, including the source line and the alt text. Then it writes a brief for your designer, or renders the file itself in code as an SVG, PNG and PDF.

Five reference files sit behind it. A chart chooser covers each form and the honesty checks, such as bars that start at zero, percentage points and Tufte's lie factor. A formats file holds social, print and slide sizes checked on each platform's own page, plus WCAG 2.2 contrast and colour rules for data. A copy file covers number style, source lines, alt text and the US rules on reusing data and on ad claims. A build file holds rendering code, tested on the worked example, that traces every number on the canvas back to the fact sheet. It never invents a figure. Where one is missing, it leaves a marked gap and asks you.

To render files and compute contrast it needs code execution switched on. Without it you still get the full plan and a designer brief. It uses a neutral font unless you upload your brand's font files and your font licence allows it. Its files are RGB, so a print job still needs a designer or printer for CMYK and crop marks. It cannot run the five-second test on a real person, so it asks you to. To get the most from it, attach the real spreadsheet or report rather than a summary, and settle the message in stage two before any layout work starts.

Claude skill · version 1.0

Infographic brief

Checking your access.

In the download · 7 files

  • SKILL.mdThe method Claude follows: fact sheet, the one message, chart choice, wireframe, copy, build and check, one stage at a time.
  • README.mdHow to install it in claude.ai or Claude Code, how to start, and the licence.
  • references/worked-example.mdA full worked example for a fictional soap brand, through all seven stages, with the code that rendered the finished graphic.
  • references/chart-chooser.mdWhich chart answers which question, rules for each form, process diagrams, and honesty rules with numbers.
  • references/formats-and-legibility.mdSocial, print and slide sizes checked on each platform's own page, grids, type sizes, WCAG 2.2 contrast and colour for data.
  • references/copy-and-sources.mdHeadlines, number style, source lines, alt text, and the US rules on reusing data and on advertising claims.

Install it and begin

  1. 01Install it in Claude CodeTerminal
    mkdir -p ~/.claude/skillsunzip ~/Downloads/infographic-brief.zip -d ~/.claude/skills/# Start it with /infographic-brief. If this is your first skill, type /reload-skills once.

    On claude.ai there is nothing to unzip: upload the zip as it is. Every step is on Install and use a Claude skill.

  2. 02Your first message to ClaudeText
    Use the infographic brief skill. I've attached [WHAT THE FILE IS, FOR EXAMPLE A SURVEY PDF]. It is for [AUDIENCE] and will run on [WHERE, FOR EXAMPLE INSTAGRAM OR A PDF REPORT]. I think the point is [YOUR HUNCH, OR NOT SURE]. Start with the fact sheet and tell me what is missing.

    Attach the real spreadsheet, PDF or notes rather than a summary, plus your brand guide if you have one. Switch on code execution if you want a finished file.

Common mistakes

Infographic mistakes, and what to do instead

  • Instead ofA headline that names the topic, such as "Refill sales, 2025 to 2026".

    Do thisA headline that states the finding with its number, such as "Refill sales grew 2.8 times in five quarters".

  • Instead ofBars that start at 50 so a small change looks dramatic.

    Do thisBars that start at zero. If the change is small, show it with a dot plot or a line on a labelled axis.

  • Instead ofA pie chart with seven slices.

    Do thisSorted horizontal bars. Keep pies for two or three parts of one whole.

  • Instead of"Up 23%" when a share went from 18% to 41%.

    Do this"Up 23 percentage points", or "more than doubled". As a percentage change it is 128%.

  • Instead ofAsking an image generator to draw the chart and its numbers.

    Do thisDrawing the chart from the data, in code or a design tool. Image models redraw text and invent marks.

  • Instead ofFilling a missing month with an estimate so the line looks complete.

    Do thisLeaving the gap visible and saying why in a note.

  • Instead ofA legend of six colours the reader has to match back and forth.

    Do thisLabels beside the bars or lines they name, with colour never the only cue.

  • Instead of"Source: internal data" in tiny pale grey type.

    Do thisThe organisation, the report or dataset, the period and the base, in a colour that passes 4.5:1 contrast.

What to do it with

  • ClaudeFree tier, paid above it

    A language model that writes, edits, reads long documents and runs tools, including agents that work inside a codebase.

    Bad at It is agreeable by default, so it will improve a bad idea instead of telling you it is bad. Ask it to argue against you and the quality of the answer changes.

  • Claude CodeSubscription

    An agent that reads a whole repository, edits files, runs the tests and explains what it changed.

    Bad at It is fast enough to make a large mistake quickly. Work on a branch, read the diff, and never let it push. Watch the starting mode: on Pro, Max and Team plans it opens in auto mode, which Anthropic's own list says may read a .env file and send the key in it to the API that key belongs to. Switch it off.

  • FigmaFree tier, paid above it

    The shared file where interface design happens: components, variables, prototypes and the handoff to code.

    Bad at Its generative features make plausible screens rather than considered ones, and a plausible screen is the hardest kind to argue with in a review.

  • IllustratorSubscription

    Vector drawing, where logos and dielines are actually built.

    Bad at Its generative vector features produce shapes that look right and have terrible point structure underneath.

  • CanvaFree tier, paid above it

    Templates, brand kits and generation in one place, built so a non-designer can produce something acceptable.

    Bad at Acceptable is the ceiling as well as the floor. Its templates are so widely used that a trained eye dates a deck in a second.

The whole tool directory

Why it matters

Ask a chat for an infographic and it tends to cram in every number and fill any gap with a figure that looks plausible. This skill makes Claude settle one message first, choose each chart by the reader's question, keep the axes honest, and trace every number on the canvas back to a source you supplied, so nobody finds a made-up statistic after it has gone out.


Type
technique
Period
ongoing

Hear about new courses.

Leave an email and we will tell you when something new lands. We do not write often.