designer
Drive Claude Design from your codebase with live URLs
All Skills in This Repository (1)
Pure Emerald Level IndicatorsFrequently Asked Questions
FAQPage SchemaHow to install designer?โผ
Run `npx skills add pro-vi/designer --all -g -y` in your terminal to install all skills in this repository globally.
What does designer actually do?โผ
It lets your coding agent control claude.ai/design through a real Chrome browser, sending prompts enriched with your codebase's entities, states, and design tokens, then returning live design URLs for review.
How do I turn a design into real code?โผ
Run the handoff step, which downloads the project export zip into your repo with all design files plus a regenerated decision-record.md that an implementing agent reads to build the real code.
Does designer work with Claude Code?โผ
Yes. It registers as an MCP server with Claude Code at user scope and installs the designer-loop skill, so your agent can run the full intent-to-handoff design loop.
Do I need design experience to use designer?โผ
No. You describe what you want in plain feelings and react to the variants Claude Design produces, while the agent handles prompting, iteration, and export.
Related Repositories in Design & Creative
View All in Design & Creativeโui-ux-pro-max-skill
AI design intelligence for professional UI, brands, and presentations
ui
Build and customize beautiful React component libraries with AI
open-design
Open-source AI design studio for decks, prototypes, images, and video