/web-design-guidelines
Review UI code for Web Interface Guidelines compliance by the Vercel engineering team. Covers layout, typography, color, motion, and accessibility for product UI.
One skill from open-design.
shell
$ npx -y skills add nexu-io/open-design --skill web-design-guidelines --agent claude-codeInstalls just this skill. Get the whole plugin for auto-invocation.
How it fires
How this skill gets triggered: by you, by Claude, or both.
- Fires itselfClaude auto-loads it when your prompt matches the work.
- You can call itInvoke it directly when you want it.
- Slash command
/web-design-guidelines
Context preview
The summary Claude sees to decide when to auto-load this skill.
Review UI code for Web Interface Guidelines compliance by the Vercel engineering team. Covers layout, typography, color, motion, and accessibility for product UI.
Stats
Stars80,930
Forks9,351
LanguageTypeScript
LicenseApache-2.0
Ships with open-design
SKILL.md
web-design-guidelines.SKILL.md
--- name: web-design-guidelines description: | Review UI code for Web Interface Guidelines compliance by the Vercel engineering team. Covers layout, typography, color, motion, and accessibility for product UI. triggers: - "web design guidelines" - "vercel design" - "product ui standards" - "design checklist" - "review my UI" - "check accessibility" - "audit design" - "review UX" - "设计审查" metadata: author: vercel version: "1.0.0" argument-hint: <file-or-pattern> od: mode: design-system surface: web platform: desktop category: design-systems upstream: "https://github.com/vercel-labs/web-interface-guidelines" source-commit: 4e799d45c17aec1498c269287a83b9dba22b966b preview: type: markdown example_prompt: | Review my UI code against the Vercel Web Interface Guidelines — check layout, typography, color, motion, and accessibility compliance. --- # Web Interface Guidelines Review files for compliance with Web Interface Guidelines.
