Frontend Design

Build and polish web UI that does not look templated: an aesthetic direction before the first component, React structure and performance, purposeful motion, and a review against interface guidelines and worst-case data before shipping.

Skills, all imported unmodified:

• frontend-design from https://github.com/anthropics/skills (Apache-2.0): design direction for new UI.
• redesign-existing-projects from https://github.com/leonxlnx/taste-skill (MIT): audit and upgrade an existing UI.
• web-design-guidelines, vercel-react-best-practices, vercel-composition-patterns from https://github.com/vercel-labs/agent-skills (MIT): UI review, React and Next.js performance, component APIs.
• emil-design-eng, animate, review-animations, break-ui from https://github.com/emilkowalski/skills (MIT): interaction polish, motion, and stress-testing a component with worst-case data.

The Playwright MCP server lets the agent open the page and look at what it built.

Start with a UI request ("design a pricing page", "redesign this dashboard", "review my UI", "break this card component").

Prerequisites: Node.js for the Playwright MCP server and a running dev server to look at; nothing else. web-design-guidelines fetches its rules from GitHub when it runs.

Not affiliated with the skills' authors. The React skills assume React or Next.js; the design skills work with any stack.