Colorfigures

A skill for Claude

Colorfigures

Describe an everyday object. Claude draws it hand-inked and isometric, with buttons that actually work.

mkdir -p ~/.claude/skills && curl -fsSL https://april-zhu.com/colorfigures/colorfigures.tar.gz | tar -xz -C ~/.claude/skills

Paste in Terminal for Claude Code. Using Claude.ai or Windows? Other ways to install.

Download skill (.zip) ↓ See all figures →

One sentence in, a working object out

Each of these came from the prompt above it, in a fresh install of the skill. No code was written by hand.

Youa gumball machine where I can put in a coin and turn the crank
→
Gumball machine Open ↗
Youan electric kettle that boils, then clicks itself off when done
→
Kettle Open ↗
Youa record player: put on a record, drop the needle and it plays
→
Record player Open ↗

More made with the skill

Hover to see one move. Open any of them and press things.

Washing machine▶ Play
Washing machine →
Espresso machine▶ Play
Espresso machine →
Vending machine▶ Play
Vending machine →
Toaster▶ Play
Toaster →
Traffic light▶ Play
Traffic light →
Smoke alarm▶ Play
Smoke alarm →
Capsule toy machine▶ Play
Capsule toy machine →
Music box▶ Play
Music box →

See all figures in the demo →

How to install

Three steps, about a minute.

  1. 1

    Install

    Open Terminal (on a Mac: ⌘ Space, type Terminal), paste this and press Return.

    mkdir -p ~/.claude/skills && curl -fsSL https://april-zhu.com/colorfigures/colorfigures.tar.gz | tar -xz -C ~/.claude/skills
  2. 2

    Restart Claude Code

    Quit and reopen it so it picks up the new skill.

  3. 3

    Ask for a figure

    Describe an object in plain words, or start with /colorfigures. Claude saves an .html file; open it in your browser and press things.

Try these prompts

Copy one, paste it into Claude, open the file it makes.

a gumball machine where I can put in a coin and turn the crank
a record player: put on a record, drop the needle and it plays
a kettle that boils and clicks off by itself — show how it knows when to stop
how does a toaster know when to pop? make it a Colorfigure
a bike pump filling a tyre, with a see-through valve
a parcel locker wall: type a code and the right door pops open

Questions

What is a skill?

A small folder of instructions and templates that teaches Claude how to do one job well. It isn't an app and doesn't run by itself; Claude reads it when you ask for something it covers.

Claude isn't using it

Restart Claude Code, then mention it by name: "use the colorfigures skill to draw a gumball machine". To check it's installed, run ls ~/.claude/skills/colorfigures; you should see SKILL.md, README.md, LICENSE, assets and scripts.

What kinds of objects work best?

Everyday machines and devices with a clear front and parts you can press: appliances, vending and arcade machines, toys, signs, kiosks. It's great at "how does it work" figures with a see-through panel. Soft, organic things (people, animals, plants) don't suit the style.

How long does a figure take, and how many tokens?

About 10 to 20 minutes and roughly 175,000 to 250,000 tokens per figure, measured on fresh test runs in Claude Code. Most of that goes on modelling the object and its moving parts; then Claude takes a few screenshots, runs through the buttons once, zooms in on the trickiest part and fixes what it finds, in one or two rounds. A single object lands near the low end (a desk fan took 9 minutes and 174,000 tokens); a scene with several objects and a step-by-step process near the high end (a filter coffee set took 20 minutes and 245,000 tokens). Changes you ask for afterwards in the same chat are much quicker. On a Claude plan this counts toward your usage; on the API it's billed per token.

Can I change the colours?

Yes. Every figure has body-colour swatches (tomato, mustard, mint, cobalt, blush) and a hand-drawn wobble slider. You can also ask Claude for a particular colour.

Is it safe to install?

It's seven small plain-text files (about 110 KB): the instructions, the drawing engine, two example figures, a build script and a licence. Installing only copies them; nothing runs, and there are no packages or dependencies. Each figure Claude makes is a single HTML file that runs in your browser like any web page, with no tracking, accounts or outside requests. Want to look first? Download the .zip and open SKILL.md in any text editor.

Do I need to code?

No. Describe the object in plain words. If you want changes, say so in the same chat: "make the door open further", "add a coin return".