Guide · Agent skill
How to use the Two-Colour Brush Illustrations agent skill
Updated · written with AI from the project's own documentation and checked against our catalogue data
The Two-Colour Brush Illustrations skill (skill name illustration-two-colour-brush) lets an AI agent draw original illustration cards as SVG files in a fixed hand-made style: thick black marker lines, flat mint-green blocks slightly off-register, and chunky people coding, thinking or resting on warm cream paper. It is for designers, front-end developers and marketers who need playful artwork for empty states, onboarding, 404 pages and blog headers. After this guide you will know what the skill does, how to install it, how to ask for artwork in a way that triggers it, and what it needs to run.
Two-Colour Brush IllustrationsMengTo/Skills · MIT Download the skill Quick start
- 1Download and unzip. Download the skill ZIP from this page and unzip it to get the illustration-two-colour-brush folder.
- 2Place the folder. Move it into ~/.claude/skills/ for personal use, or into a project's .claude/skills/ folder. Alternatively, upload it in the Claude apps under Settings → Capabilities → Skills.
- 3Install rendering tools. If you want PNG output, install Node.js, Playwright or playwright-core, and a Chromium browser.
- 4Ask for a card. Describe the scene, the size (480x360 is the card size the style uses) and where the art will go, naming the skill if you like.
- 5Check the result. Open the SVG file in a browser and look at the line wobble, mint offset and cream paper. Ask for changes in plain language.
What an agent skill is and what this one makes the agent do
An agent skill is a folder of instructions and supporting files that an AI agent loads when a request matches it. This skill gives the agent a specific illustration style and the tools to draw in it consistently.
Each card is 480 by 360 pixels and built from hand-authored SVG. Lines are filled ribbons that wobble in width and end in blobs, not plain SVG strokes. The only inks are black and mint green, on paper cream. Characters are chunky, with profile heads, big noses, dot eyes, big hands and feet, and they do one readable thing such as coding, thinking, carrying or resting, usually with laptops, mugs, chairs or rubber ducks.
- Output: original SVG illustration cards in the two-colour brush style
- Bundled scripts: brush.mjs draws the marks, lint.mjs checks the output, render.mjs renders PNG images
- Licence: MIT
Install the skill from the ZIP or the Claude apps
Download the skill ZIP from this page and unzip it. Then put the resulting skill folder in one of two places: your personal skills folder at ~/.claude/skills/, or a project's .claude/skills/ folder if you want the skill to apply only to that project.
If you use the Claude apps instead, open Settings, go to Capabilities, then Skills, and upload the skill there.
- Personal use across projects: ~/.claude/skills/
- Single project: the .claude/skills/ folder inside that project
- Claude apps: Settings → Capabilities → Skills
Set up rendering requirements before you need PNGs
The skill can draw and check SVG without extra tools, but rendering to PNG needs Node.js (the scripts are .mjs files), Playwright or playwright-core, and a Chromium browser. The skill's files do not mention API keys or accounts.
Because the skill runs scripts, read the files before you install it if you work in a sensitive environment. The source states that the skill does not use the network.
- Node.js is required
- Playwright or playwright-core is required for rendering
- A Chromium browser is required for rendering
- No API keys or accounts are mentioned in the files
- Runs scripts: yes. Uses network: no
Trigger the skill with natural requests
The skill loads when your request asks for brush, marker, felt-tip, two-colour, duotone, riso-print, zine, mint-and-black or doodle illustrations, or for empty states, onboarding, 404 pages, blog headers, feature spots or marketing cards with a bold hand-made look. You do not need to name the skill, but naming it makes it more reliable.
A minimal prompt from the demo folder looks like this in plain language:
- Use the illustration-two-colour-brush skill to draw a 480x360 SVG card of a designer sketching wireframes on a big pad propped on her knees.
- Make a mint-and-black zine-style header for our blog post about caching.
- Draw a 404 page illustration: a developer chasing a missing file, marker style, cream background.
Examples of what the skill draws
The skill ships with three example cards in its examples folder, and the demo prompts describe them. They show the range the style covers: one figure, one readable coding action, and a few props.
- Rubber Ducking: a curly-haired developer on a round mint floor cushion, explaining with an open hand to a rubber duck, with a speech bubble and a question mark.
- Coffee-Driven: a developer with a hair bun striding right, carrying an open laptop like a tray while a tower of takeaway cups spills, with speed lines.
- Night Owl: a tired developer in a camo-upholstered armchair at 3 a.m., with a laptop, a raised mug, a night window with a mint moon, a wall clock and a plug.
Know the limits and when another style fits better
The style uses only two inks and paper. The skill forbids other colours, grey, tints, gradients, filters and drop shadows, so it is not suited to photorealistic or full-colour imagery.
The skill's own notes point to sibling skills for other looks: illustration-ink-sketch for wobbly brush lines with hatching and full colour, illustration-one-line for a single continuous line with off-register colour, illustration-halftone-line for thin black line with halftone dots, and illustration-flat-with-black for flat colour with solid black shapes and no marker texture.
- Need full colour or hatching: illustration-ink-sketch
- Need one continuous line: illustration-one-line
- Need thin line and halftone: illustration-halftone-line
- Need flat colour without marker texture: illustration-flat-with-black
What people use it for
- Empty state art for a project list with no items yet
- 404 page illustration of a developer searching for a missing file
- Onboarding card showing a person thinking through a first setup step
- Blog header with a zine or riso feel for an engineering post
- Feature spot on a marketing page for a developer tool
Frequently asked questions
Is the illustration-two-colour-brush skill free?
The skill is published under the MIT licence, as stated on this page. Check the licence file in the download if you need the exact terms for your project.
What do I need to install it?
To install the skill you only need to unzip it into ~/.claude/skills/ or a project's .claude/skills/ folder, or upload it in the Claude apps. To render PNG output you also need Node.js, Playwright or playwright-core, and a Chromium browser.
Does the skill need an API key or an account?
The skill's files do not mention API keys or accounts. The source also states that the skill does not use the network.
Is it safe to run the skill's scripts?
The skill runs scripts, including brush.mjs, lint.mjs and render.mjs. Read the files before installing if your environment is sensitive, and keep the skill in a project folder you control.
Can it make photorealistic or full-colour images?
No. The style is limited to two inks, black and mint, on cream paper, and the skill forbids other colours, gradients and filters. Use a different skill or tool for full-colour imagery.
How is it different from the other illustration skills?
This skill has thick wobbly marker lines with mint plates slightly off-register. illustration-ink-sketch adds hatching and full colour, illustration-one-line uses a single continuous line, illustration-halftone-line uses thin line with halftone dots, and illustration-flat-with-black uses flat colour with solid black shapes.
New agent skills, repos and AI tools — every week
The best new skills and open-source projects, the fastest-growing repos, and one free prompt. Five minutes to read. Unsubscribe anytime.
Our verdict
Use this skill if you want a bold, hand-made two-colour look for empty states, onboarding, 404 pages or marketing cards and you can install Node.js and a Chromium browser for PNG output. Pick a different skill, or a different tool, if you need photorealistic, full-colour or thin line art, or if you want a plug-and-play tool with no setup.
Download the skill