Review UI code for Web Interface Guidelines compliance. Use when asked to "review my UI", "check accessibility", "audit design", "review UX", or "check my site against best practices".
Add this skill
npx mdskills install vercel-labs/web-design-guidelinesDelegates guideline rules and formatting to external URL, providing minimal agent instruction
A collection of skills for AI coding agents. Skills are packaged instructions and scripts that extend agent capabilities.
Skills follow the Agent Skills format.
React and Next.js performance optimization guidelines from Vercel Engineering. Contains 40+ rules across 8 categories, prioritized by impact.
Use when:
Categories covered:
Review UI code for compliance with web interface best practices. Audits your code for 100+ rules covering accessibility, performance, and UX.
Use when:
Categories covered:
React Native best practices optimized for AI agents. Contains 16 rules across 7 sections covering performance, architecture, and platform-specific patterns.
Use when:
Categories covered:
React composition patterns that scale. Helps avoid boolean prop proliferation through compound components, state lifting, and internal composition.
Use when:
Patterns covered:
Deploy applications and websites to Vercel instantly. Designed for use with claude.ai and Claude Desktop to enable deployments directly from conversations. Deployments are "claimable" - users can transfer ownership to their own Vercel account.
Use when:
Features:
package.jsonnode_modules and .git from uploadsHow it works:
Output:
Deployment successful!
Preview URL: https://skill-deploy-abc123.vercel.app
Claim URL: https://vercel.com/claim-deployment?code=...
npx skills add vercel-labs/agent-skills
Skills are automatically available once installed. The agent will use them when relevant tasks are detected.
Examples:
Deploy my app
Review this React component for performance issues
Help me optimize this Next.js page
Each skill contains:
SKILL.md - Instructions for the agentscripts/ - Helper scripts for automation (optional)references/ - Supporting documentation (optional)MIT
Install via CLI
npx mdskills install vercel-labs/web-design-guidelinesWeb Design Guidelines is a free, open-source AI agent skill. Review UI code for Web Interface Guidelines compliance. Use when asked to "review my UI", "check accessibility", "audit design", "review UX", or "check my site against best practices".
Install Web Design Guidelines with a single command:
npx mdskills install vercel-labs/web-design-guidelinesThis downloads the skill files into your project and your AI agent picks them up automatically.
Web Design Guidelines works with Claude Code, Claude Desktop, Cursor, Vscode Copilot, Windsurf, Continue Dev, Codex, Gemini Cli, Amp, Roo Code, Goose, Opencode, Trae, Qodo, Command Code. Skills use the open SKILL.md format which is compatible with any AI coding agent that reads markdown instructions.