Skip to content
Get packs

Halftone Line Illustrations

Draws black-and-white halftone line-art SVG illustrations in a consistent editorial style

Source Download skill
Repository
MengTo/Skills
Stars
7,187
Licence
MIT
Files
8 files

What it does

Once installed, the agent can produce hand-drawn-looking spot illustrations as SVG files: a single black ink on warm off-white paper, with a slightly wobbly line, open outlines, and greys made only of printed-looking dots. It includes a compiler script that turns simple tone instructions into dot fills and a render script that produces PNG previews so the agent can check its own work.

Great for

  • Designers making empty states, onboarding screens, 404 pages or blog headers in a monochrome editorial look
  • Front-end developers who need small, colour-free SVG artwork for a website
  • Marketers who want consistent black-and-white feature cards

Skip it if

  • Projects that need colour: the skill says any colour in the brief means it is the wrong style and other skills in the same family fit better
  • Photorealistic or detailed illustration, since it produces a deliberately simple hand-drawn look
  • Environments where running scripts is not allowed, because the compile and render steps execute Node.js code and may launch a headless Chromium browser

Try asking

  • “Make a halftone line illustration of two people reviewing a design on a laptop for our onboarding screen”
  • “Create a 480x360 black-and-white 404 page illustration of someone looking for a lost file”
  • “Draw a halftone-style blog header showing someone on a commute with headphones”
Step-by-step guide: how to use Halftone Line IllustrationsInstall, first run, examples, tips and FAQs

Install in 3 steps

  1. 1

    Download the skill

    The ZIP contains the 8 original files, the MIT licence and an attribution note.

    illustration-halftone-line.zip
  2. 2

    Add it to your agent

    Claude Code (all projects)

    mkdir -p ~/.claude/skills && unzip illustration-halftone-line.zip -d ~/.claude/skills/

    Claude Code / Agent SDK (this project only)

    mkdir -p .claude/skills && unzip illustration-halftone-line.zip -d .claude/skills/

    Claude apps (web/desktop): Settings → Capabilities → Skills → Upload skill, and choose the ZIP.

  3. 3

    Ask for the task

    No special command needed — the agent reads the skill's description and loads it when your request matches. Try one of the prompts above.

Get better results

  • Give each card its own seed value so the wobble and dot patterns differ between illustrations
  • Keep briefs calm and human-focused (collaboration, focus time, reviews), which is the style's stated sweet spot
  • Review the rendered PNG and ask for a critique pass, since the skill describes a render-and-critique loop

What's inside

  • agents/openai.yaml
  • demo/PROMPT.md
  • references/craft.md
  • scripts/halftone.mjs
  • scripts/lint.mjs
  • scripts/render.mjs
  • SKILL.md
  • style.json

Redistributed unmodified from MengTo/Skills under the MIT licence. The assessment was drafted with AI from the skill's files on 2026-10-29. Skills can instruct your agent to run code — read SKILL.md and any scripts before installing.