How to add any of these
You don't need to memorise ten different install commands. They all live on GitHub, and Claude Code knows how to install a skill from a repo. So the move is the same every time:
The one instruction that works for all 10
Copy the GitHub link for the skill you want, paste it into Claude Code, and say:
Claude Code reads the repo, works out the right install method, and sets it up. If it asks a question, answer it — that's normal. Then just start asking it to design things.
Two quick notes
A couple of these aren't a tidy one-click install — shadcn/ui switches itself on automatically once it sees a shadcn project, and Awesome Claude Design is a library of design-system files you drop in rather than a packaged skill. The "paste the link and ask" move still gets you there — Claude will tell you what it's doing.
The 10 skills, ranked by power
Ordered from handy to honestly unfair. The early ones tidy up what you've already got; the later ones design whole systems from a sentence. Work down the list — or just grab the ones that fix your current mess.
Web Design Guideline
Audits your code against Vercel's design rules and flags exactly where your UI is weak.
Why it matters: it's the cheapest win here — a second opinion that catches the lazy spacing and contrast mistakes before anyone else sees them.
github.com/vercel-labs/agent-skills →
Extract Design System
Point it at any live website and it pulls the colours, fonts, spacing and shadows.
Why it matters: stop eyedropping screenshots — steal a whole design language in one go and hand it to Claude as a starting point.
github.com/arvindrk/extract-design-system →
shadcn/ui (official skill)
Gives Claude proper, project-aware knowledge of shadcn components instead of reinventing the same button forty times.
Why it matters: if you build with shadcn, this is the difference between clean, consistent components and a pile of one-off markup.
github.com/shadcn-ui/ui →
shadcn Audit
Finds components you already have before you build new ones, then reviews the ones you made against the real patterns.
Why it matters: kills duplicate components and quietly teaches you better habits while it works.
github.com/mattbx/shadcn-skills →
Emil Kowalski Motion
Most AI design is dead static. This adds real, considered motion to your components.
Why it matters: motion is the line between "an AI made this" and "a designer made this" — and almost nobody is doing it.
github.com/kylezantos/design-motion-principles →
Brand Kit
Give it a rough idea and it hands you a full brand board — logos, colours, type pairings, mockups, the whole direction.
Why it matters: turns "I have a vibe in my head" into something you can actually build against, in minutes.
github.com/leonxlnx/taste-skill →
Frontend Design (Anthropic)
Anthropic's own skill, built to make Claude take bold design swings instead of safe, generic slop.
Why it matters: it's the anti-boring setting — straight from the people who built the model, so it knows how to push it.
github.com/anthropics/skills →
Figma to React
Hand it a visual reference and it builds the real coded version — then checks its own work against the design.
Why it matters: the self-checking loop is the magic. It doesn't just guess once, it keeps going until the code matches the picture.
github.com/gbasin/figma-to-react →
UIUX Pro Max
A full design brain — 67 styles, 161 palettes, font pairings and charts it can reason over.
Why it matters: this is where it stops being a helper and starts making real design decisions for you.
github.com/nextlevelbuilder/ui-ux-pro-max-skill →
Awesome Claude Design
Drop in one file and it scaffolds a whole design system in a single shot.
Why it matters: this is the unfair one. The closest thing to "make me a real product" as a single instruction.
github.com/VoltAgent/awesome-claude-design →
Where to start if you only grab one
Designs look amateur? Start with Frontend Design (#7). Building with shadcn? shadcn (#3). Want the "whoa" moment fast? UIUX Pro Max (#9). You don't need all ten on day one.
Want to build the whole stack with me?
Installing the skills is step one. Knowing how to actually wield them is where it gets fun — that's what I teach.
Wright Mode Membership
Join a community of women entrepreneurs implementing AI and automation in their businesses. Live calls, templates, and ongoing support.
Claude Masterclass
Learn how to use Claude like a pro. From prompting fundamentals to building real workflows that save hours every week.
Claude Code Masterclass
Go beyond the chat interface. Build automations, process data, and create tools with Claude Code — no developer experience needed.