Skip to content

Flat Illustration with Black

Draws flat vector people illustrations with solid black accents, for empty states, headers and cards.

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

What it does

This skill teaches an AI agent a specific illustration style: flat, outline-free coloured shapes of tall, lanky people doing design or coding tasks, with large solid black areas for hair, trousers, shoes and devices. Once installed, asking the agent for this kind of picture makes it follow a fixed palette, line weights, character proportions and composition rules, and it can use bundled helper scripts to build the SVG artwork and check it against the style.

Great for

  • Designers who want a consistent friendly illustration set for a product or website
  • Developers building empty states, 404 pages or onboarding screens who need quick on-brand art
  • Marketers creating blog headers or feature cards in this particular look

Skip it if

  • Anyone wanting outlined cartoons or navy-and-lavender confetti styles, since sibling skills cover those and this one will drift off-style
  • Photo-realistic or non-flat artwork, which this style does not produce

Try asking

  • “Draw a flat illustration with black of a developer celebrating a successful deploy, for our 404 page”
  • “Make a flat people illustration of a stand-up at a sticky-note board for our onboarding screen”
  • “Create a feature spot card in this flat black style showing someone reviewing code”
Step-by-step guide: how to use Flat Illustration with BlackInstall, 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-flat-with-black.zip
  2. 2

    Add it to your agent

    Claude Code (all projects)

    mkdir -p ~/.claude/skills && unzip illustration-flat-with-black.zip -d ~/.claude/skills/

    Claude Code / Agent SDK (this project only)

    mkdir -p .claude/skills && unzip illustration-flat-with-black.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

  • Ask for one or two people and one clear action so the composition stays readable, as the style guide recommends.
  • Keep black shoes as the default; coloured shoes can pull attention away from the main prop.
  • Use the lint script with the style palette to catch off-palette colours before publishing the artwork.

What's inside

  • agents/openai.yaml
  • demo/PROMPT.md
  • references/craft.md
  • scripts/lint.mjs
  • scripts/parts.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.