Summary
This is a structured workflow skill that turns Claude into a design tool for shipping HTML prototypes, slide decks, and landing pages. The workflow loop (understand, explore, plan, build, verify, deliver) keeps the agent from jumping straight to code, and it includes Playwright for screenshot verification after every build. It pulls brand systems from getdesign.md, so you can say "make this look like Stripe" and get their tokens automatically applied as CSS variables. Uses pinned React and Babel CDN versions to avoid breakage. Includes export scripts for PPTX, PDF, and single-file HTML. The "always generate 3+ variations" rule is useful for exploring directions without manual iteration. Best for solo devs or small teams who need design artifacts without opening Figma.
Install to Claude Code
npx -y skills add aradotso/trending-skills --skill cc-design-html-prototyping --agent claude-codeInstalls into .claude/skills of the current project.
Keep your Mac awake while Claude Code and 40+ AI agents run. Sleeps when they're idle.
One time payment $9 →
Integrate web data into your AI product. One API to scrape website & brand data.
Get API Key Now →
Agent, run crypto. Access onchain data & trade routes via 1inch.
Install now →
On Capafy, your Skill runs online 24/7 as an agent product, and you get paid every time someone uses it.
Start earning →
Files
SKILL.md
Select a file.
Featured
Keep your Mac awake while Claude Code and 40+ AI agents run. Sleeps when they're idle.
One time payment $9 →Integrate web data into your AI product. One API to scrape website & brand data.
Get API Key Now →Agent, run crypto. Access onchain data & trade routes via 1inch.
Install now →On Capafy, your Skill runs online 24/7 as an agent product, and you get paid every time someone uses it.
Start earning →
