Spotkit

Generate minimal, abstract, UI-inspired illustrations for software product features — as deterministic SVG. Use when asked for a feature illustration, product illustration, spot illustration, empty-state graphic, feature-card artwork, docs or developer-portal illustration, or a consistent illustration set/family for a product. Also use to turn a feature description or a product screenshot into an abstract UI illustration, to add a new illustration to an existing family, or to retheme an existing set.

100 stars 9 forksImages, Video & Audio

Install

skills CLI (Claude Code, Cursor, Codex and more)

npx skills add Devesh-Shirsath/spotkit --skill spotkit

Manual install

git clone --depth 1 https://github.com/Devesh-Shirsath/spotkit.git /tmp/spotkit
mkdir -p ~/.claude/skills
cp -r /tmp/spotkit/. ~/.claude/skills/spotkit

Personal skills live in ~/.claude/skills. Use .claude/skills in a project folder to share a skill with your team.

From the SKILL.md

# Spotkit

Turn a feature description into a quiet, abstract illustration that looks like a
product interface reduced to its most recognizable primitives.

The governing principle:

> **Abstract the interface, not the idea.**

Someone should look at the result and think *"I understand what this feature
does"* — not *"that's a screenshot of the product."*

## Output format

**Default to SVG.** This style is pure geometry — hairline borders, exact radii,
repeated placeholder bars, one stroke weight. Writing it directly gives exact,
repeatable output and makes every illustration in a set provably identical in
treatment. Image models fail at precisely these things, and fail hardest at
consistency across a set.

Use `references/image-prompt.md` only when the user explicitly wants a prompt for
an external image model.

## Workflow

**Read `SPEC.md` first.** It holds every number, the SVG template, the building
blocks and a complete example — enough to draw from. The references below are
for the decisions; open one only when a step needs it.

1. **Interpret the feature.** One sentence: what does it actually do?
   → `references/metaphor.md`
2. **Choose the metaphor.** What *relationship* is this feature about — grouping,
   connecting, gating, packaging, reviewing, sequencing?
3. **Pick 2–5 primitives** that carry that relationship. Not more.
4. **Pick one of the twelve layouts — then adapt it, don't invent.**

Read the full skill on GitHub

Details

Skill name: spotkit
Repository: Devesh-Shirsath/spotkit
License: MIT
Repo updated: 8 October 2026

FAQ

What does the Spotkit skill do?

How do I install the Spotkit skill?

skills CLI (Claude Code, Cursor, Codex and more): npx skills add Devesh-Shirsath/spotkit --skill spotkit. Skills go in ~/.claude/skills (personal) or .claude/skills (project), and Claude loads them automatically when a task matches the description.

Is Spotkit popular?

It lives in Devesh-Shirsath/spotkit, which has 100 GitHub stars and 9 forks.

Related skills

Youtube Transcript

tubeagentkit/youtube-transcript-skills

Calls the getyoutubetranscript.com API, which is metered - 1 credit per successful request; a new account gets 100 free credits, then plans start at $5/month for 1,000 credits. Needs an API key; the skill can create the account in the conversation from the user's email and a 6-digit code. Use when the user wants a YouTube video's transcript fetched, wants to summarize/analyze/quote a YouTube video by its spoken content, wants to search YouTube (globally or a channel handle's videos), wants a channel handle resolved to its channel ID, wants the videos in a YouTube playlist, wants a channel's Sh

Images, Video & AudioIn 2 lists

Resemble Detect

resemble-ai/detect-skill

Deepfake detection and media safety — detect AI-generated audio, images, video, and text, trace synthesis sources, analyze media intelligence, and tell people from AI agents on a website (Agent Detection) using direct Resemble AI API calls

Images, Video & Audio12

Kiln

elithril/blender-kiln

Makes and fixes 3D assets in Blender, for games, the web and AR. Use when the user wants a 3D model, prop, character or GLB/glTF/FBX/USDZ file made — from a text brief, a reference image, a free marketplace (PolyHaven, Sketchfab) or AI generation — AND when they bring an existing 3D file to fix: too heavy or too many polygons (optimize, compress, LODs), broken normals, scale or origin, materials lost on glTF export, conversion between GLB, FBX and USDZ, texturing, rigging for animation, animating it (walk and idle cycles, text-to-motion, looping clips, articulated props), or inspection. Drives

Images, Video & AudioIn 2 lists

Map Motion

101

SpaceZephyr/map-motion

地图动效视频：用高德地图（真实路线、行政区边界、标准/卫星瓦片底图）做旅行与解说视频里的地图动画，出竖屏/横屏 MP4 和 GIF。十四种镜头：地球俯冲定位（从地球放大到某地）、Vlog「我在这里」瞄准锁定＋坐标卡、落点标注、公园/景区/校园地块轮廓描边与绕行、路线描线（驾车/步行/骑行/GPX，车随线走、里程表滚动、镜头跟车、海拔剖面）、飞线航线、行政区描边高亮、一对多辐射飞线、多站旅程（路线+邮戳+照片+返程；可换成卡通形象走路、到站拍照的 vlog 模式，配原创 BGM 和音效）、片尾照片墙、全景收束、标题卡、机位揭秘（咔嚓翻出照片，可做 Live Photo）、猜地点；另有 3D 地形模式（真实山体立体、卫星贴图、地球俯冲到鸟瞰、跟着人沿轨迹走、里程/海拔/爬升/小地图/海拔剖面、沿途弹照片）；十四种样式（高德标准、高德暗色、高德灰、高德复古、高德手账、卫星、境外卫星、暗色科技、极简白、水彩手账、复古纸、赛博霓虹、国风水墨、工程蓝图）。当用户说「地图动画」「地图动效」「轨迹动画」「出行轨迹视频」「旅行路线动图」「从地球放大到」「定位到某地」「飞线」「航线动画」「行政区高亮」「门店分布动画」「Vlog 地图片头」「标出某个公园/景点」「徒步/登山/骑行轨迹」「海拔剖面」「我在这里坐标卡」「3D 地形」「立体地图」「像 Google Earth 那样的轨迹」「两步路/六只脚那种

Images, Video & Audio

Hinge Profile Optimizer

b1rdmania/hinge-profile-optimizer

Improve a Hinge dating profile through research-backed screenshot audits, photo selection and ordering, conversational discovery, prompt and caption writing, settings review, or post-launch troubleshooting. Use for a full profile rebuild or a focused request about photos, copy, positioning, match quality, or profile performance.

Images, Video & Audio11

Blender Agent Studio

ifBars/blender-agent-studio

Route Blender asset creation, refinement, procedural systems, rendering, simulations, characters, validation, animation, MCP integration, and agent benchmarking work to the appropriate Blender Agent Studio workflow. Use when an agent needs an end-to-end Blender workflow or when the correct specialist skill is not yet known.

Images, Video & Audio11

Browse the most popular Claude skills, all images, video & audio skills, or write your own with the skills generator.