Skip to content
Get packs

Teal Spot Illustrations

Makes the agent draw single-object teal-on-white SVG spot illustrations in a fixed style

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

What it does

When installed, the agent can produce original 480x360 SVG illustration cards in a specific teal-on-white look: one object (such as a keyboard, database or inbox) shown in a fixed 3/4 view with a hard deep-teal shadow, outlines and a few small floating extras, and no people. It can also use bundled drawing and checking scripts to build the SVG, lint it against the style rules and render PNG previews so the result matches the set.

Great for

  • Designers who need consistent empty-state, onboarding or feature artwork in a teal palette
  • Developers building product pages or docs that need simple object illustrations as SVG
  • Marketers making blog header or card art in a single house style

Skip it if

  • People or faces in the artwork: the style explicitly forbids them, so use a character style skill instead
  • Scripts run locally can execute arbitrary code on your machine, so do not run them on untrusted inputs or in sensitive folders without review
  • Projects that need a multi-object isometric scene or bold multi-colour art, which the SKILL.md says belong to other styles

Try asking

  • “Make a teal spot illustration of a keyboard for our empty-state page”
  • “Create a 404 error spot showing a broken git graph in the teal style”
  • “Draw an onboarding step card with a database drum and two floating coins”
  • “Lint and render my teal SVG card to check it matches the palette”
Step-by-step guide: how to use Teal Spot IllustrationsInstall, first run, examples, tips and FAQs

Install in 3 steps

  1. 1

    Download the skill

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

    illustration-teal-spot.zip
  2. 2

    Add it to your agent

    Claude Code (all projects)

    mkdir -p ~/.claude/skills && unzip illustration-teal-spot.zip -d ~/.claude/skills/

    Claude Code / Agent SDK (this project only)

    mkdir -p .claude/skills && unzip illustration-teal-spot.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

  • Name one concrete object in the request so the agent picks a single hero solid, as the style requires
  • Ask the agent to run lint.mjs with the palette file after drawing to catch off-style colours
  • Review the rendered PNG against the reference cards before using the artwork publicly

What's inside

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