A skill for Claude that draws interactive isometric figures. Name an object and you get back one HTML file: a hairline isometric drawing on a numbered plate, with parts that work when you press them. Both were made with the skill.
Claude Code
> /plugin marketplace add MrBongoC/ai-iso-skill> /plugin install iso-figure@ai-iso-skill
Codex
$ npx skills add MrBongoC/ai-iso-skill -a codex
Cursor
$ npx skills add MrBongoC/ai-iso-skill -a cursor
Gemini CLI
$ npx skills add MrBongoC/ai-iso-skill -a gemini-cli
GitHub Copilot
$ copilot plugin marketplace add MrBongoC/ai-iso-skill$ copilot plugin install iso-figure@ai-iso-skill
OpenCode
$ npx skills add MrBongoC/ai-iso-skill -a opencode
Windsurf
$ npx skills add MrBongoC/ai-iso-skill -a windsurf
A skill for Claude that draws interactive isometric figures. Name an object and you get back one HTML file: a hairline isometric drawing on a numbered plate, with parts that work when you press them.
Both were made with the skill. Click either one to play with it, or open the files in examples.
The figures are plain SVG with no libraries. About 15 lines of projection code turn each face of a box into an SVG matrix(), so ordinary rects, text and paths drawn flat land on the right isometric plane, text and rounded corners included. Paint order handles depth. One state object and one render() drive the interaction, and CSS does the motion.
Before drawing anything, the skill has Claude decide what pressing a part produces: typed text, a number, a note. If the object has nothing to press, it picks a different object.
SKILL.md has the kernel, the procedure, and the rules for the look.
Claude Code, as a plugin:
/plugin marketplace add MrBongoC/ai-iso-skill
/plugin install iso-figure@ai-iso-skill
Or copy the skill folder in by hand:
git clone https://github.com/MrBongoC/ai-iso-skill.git
cp -r ai-iso-skill/skills/iso-figure ~/.claude/skills/
On Claude.ai, download iso-figure.skill from the latest release and upload it in your skill settings.
Ask for a figure of something with parts you can press:
iso figure of a kitchen timer with minute buttons and a display that counts down
fig 6, a wall light switch that turns a lamp on and off
MIT
Stars on GitHub
A design toolkit for Claude Code covering UI styling, design tokens and component specs, brand identity and voice, banners, logos, and HTML slide presentations with charts.
@nextlevelbuilderDesign guidance for AI coding agents that helps shape, critique, polish, and improve frontend interfaces such as websites, landing pages, and dashboards. It includes live browser iteration and rules that catch common issues in AI-generated frontend design.
@pbakausTurns a brief into a design prototype, website, app, deck, or video that follows your design system, then lets your team share it and refine it with an AI agent in the same project.
@nexu-ioCreates branded editorial diagrams such as architecture charts, flowcharts, sequence diagrams, ER models, timelines and swimlanes as self-contained HTML and SVG files. Suited to writers and designers who want polished visuals for Claude Code.
@cathrynlaveryA skill for Claude that draws interactive isometric figures. Name an object and you get back one HTML file: a hairline isometric drawing on a numbered plate, with parts that work when you press them. Both were made with the skill. Install it with the command on its page. It includes iso-figure. Its skills do not fire on their own yet. Free and open source.
Is this plugin yours?
Claim it with GitHubSubmit a pluginPromote it