Vercel官方web-design-guidelines
Vercel 出品。对照 Vercel 整理的 Web 界面规范逐条检查你的 UI 代码：可访问性、键盘操作、表单、加载状态、动效等，输出具体到文件和行的问题清单。
安装
skills CLI（多客户端通用）
npx skills add vercel-labs/agent-skills --skill web-design-guidelines
也可以手动安装：把仓库里的 skill 目录复制到 ~/.claude/skills/（Claude Code）或对应客户端的 skills 目录。
怎么触发
装好后不用手动调用，对 Agent 说类似的话，它会自动用上这个 Skill：
- 「review 一下这个页面的 UI」
- 「检查一下这个表单的可访问性」
适用场景
- 上线前的界面审查
- 可访问性检查
同类 Skill
frontend-design让 AI 写出的界面有设计感，不再是千篇一律的模板风vercel-react-best-practicesVercel 工程团队总结的 React / Next.js 性能优化规则ui-ux-pro-max可检索的 UI/UX 设计知识库：风格、配色、字体搭配一应俱全vercel-composition-patternsReact 组合模式：告别越加越多的 boolean propsvercel-react-native-skillsReact Native 与 Expo 的性能与工程最佳实践vercel-react-view-transitions用 React View Transition API 做页面切换和共享元素动画