pro-vipro-viCommunityยท1 Agent Skills Included

designer

Drive Claude Design from your codebase with live URLs

Connects your coding agent to claude.ai/design through a real Chrome browser, feeding codebase entities, states, and tokens into every design prompt. Returns live design URLs with tweak sliders and variant switchers so humans can react and iterate in their own words. Exports the final project bundle with a full decision record, ready for direct code implementation.
npx skills add pro-vi/designer --all -g -y

All Skills in This Repository (1)

Pure Emerald Level Indicators

Frequently Asked Questions

FAQPage Schema
How 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โ†’