Illustrative cover generated by us — see the source repo for real examples.
How to use
- 1
Copy the install prompt
Click the black button. One click, done.
- 2
Paste it to your agent
Send it in Claude Code, Codex, Cursor or similar. It installs itself.
- 3
Ask in one sentence
Say what you want, like below, and the agent follows this skill.
/superdesign make me: Exploring several UI or slide design drafts side by side on a canvasExample message showing how to invoke it, not a real output.
What you get
- Multiple design variants side by side
- Design-system extraction from existing UI
- Pages, flows, decks and posters
Good fit
- Exploring several UI or slide design drafts side by side on a canvas
Not for
- Offline work: it uses the Superdesign service
What you need
- Node.js and a Superdesign account (npx @superdesign/cli login)
- License
- MIT
- Author
- @superdesigndev
- Source
- superdesigndev/superdesign-skill/skills/superdesign · ★ 624
Upstream description
Design or redesign frontend UI, presentations, and graphics on the Superdesign canvas with a choice of leading AI models. Use whenever the user wants to design a page, feature, flow, slide deck, or brand-new product; improve or reproduce existing UI; compare design results across top models; explore visual variants; set or extract a design system; build reusable components or multi-page flows;…
Other ways to install
Prefer doing it yourself? These commands do the same as the button.
Read https://skilloop.dev/skills/superdesign/install.md and follow the instructions to install the skill.
npx skills add https://github.com/superdesigndev/superdesign-skill/tree/main/skills/superdesign -g -a claude-code
npx skills add https://github.com/superdesigndev/superdesign-skill/tree/main/skills/superdesign -g -a codex
git clone --depth 1 https://github.com/superdesigndev/superdesign-skill.git /tmp/superdesign-skill mkdir -p ~/.claude/skills && cp -r /tmp/superdesign-skill/skills/superdesign ~/.claude/skills/superdesign
Original work by its authors, redistributed under its license. We only link and describe it.
Related skills
SaaS Landing Page
A single-page SaaS landing site with hero, features, social proof, pricing and CTA — one HTML file.
Taste Design System (DESIGN.md)
Generate an agent-friendly DESIGN.md that enforces premium, anti-generic UI: strict type, calibrated colour, asymmetric layouts, micro-motion.
Design System Extractor
Analyse an existing Stitch project and synthesise its semantic design system into DESIGN.md.
shadcn/ui Expert
Guidance for discovering, installing and customising shadcn/ui components with solid architecture and theming practices.