AI Inspiration WorldAdded Nov 4, 2026
spotkit
Turns a one-line feature description into a clean, abstract SVG product illustration, for product designers and developers.
- Ecosystem
- Agent Skills
- Skill category
- Design
- Creator / organization
- Devesh-Shirsath
What it is
Spotkit is a Claude Code Skill by GitHub user Devesh-Shirsath. Say "Create an illustration for API version management," and it works out what the feature does and which relationship it's about, picks 2 to 5 UI primitives, chooses one of 12 layouts, then writes the SVG by hand. It draws an abstraction of the interface: keep the most recognisable parts of a feature and drop the other 90%. What sets it apart is that it uses no image model; every stroke width, radius and colour comes from one spec, so twenty illustrations still look like one family.
Highlights:
- Twelve CSS variables drive light and dark themes from the same files
- icons all come from the Phosphor set
- it runs a checklist from the spec before answering
- you can open examples/gallery.html in a browser to see samples without installing.
How to use:
- First clone the repo into ~/.claude/skills/spotkit (for Codex, ~/.agents/skills/spotkit).
- Then restart Claude Code or Codex.
- Finally just ask for a feature illustration, an empty-state graphic or a whole product set.
Who it's for:
Product designers and front-end developers who need consistent illustrations for feature pages and empty states.
Before you start:
- No other dependencies; Python 3 is needed only to regenerate samples or run check.py.
- On Claude.ai you can upload a zip of the repo, and in ChatGPT or other chat tools you can upload SPEC.md and a few reference files to a Project.
- The README doesn't mention going online or an API key.
- MIT license.
Based on the project's public documentation. Not tested by AI Inspiration World.