Claude Code Skills Reference
本项目可用的 12 个 Claude Code Skills 汇总，按来源分 4 组，附项目链接与触发场景
本项目可用的 Claude Code Skills 汇总。通过 /skill-name 调用。
Vercel Agent Skills
| Skill | 说明 | 触发场景 |
|---|---|---|
/vercel-react-best-practices | React 和 Next.js 性能优化指南，涵盖组件渲染、数据获取、Bundle 优化等 | 编写、审查或重构 React/Next.js 代码时 |
/vercel-composition-patterns | React 组合模式——compound components、render props、context providers 等 | 重构存在 boolean prop 泛滥的组件、设计可复用组件 API 时 |
/vercel-react-native-skills | React Native / Expo 移动端最佳实践，涵盖列表性能、动画、原生模块 | 构建 React Native 组件或优化移动端性能时 |
/web-design-guidelines | 审查 UI 代码是否符合 Web Interface Guidelines（100+ 规则） | 审查 UI、检查可访问性、审计设计、检查 UX 时 |
UI Skills
🔗 来源：ibelick/ui-skills · 官网：ui-skills.com
| Skill | 说明 | 触发场景 |
|---|---|---|
/baseline-ui | 验证动画时长、排版比例、组件可访问性，防止布局反模式 | 构建 UI 组件、审查 CSS 工具类、执行设计一致性检查时 |
/fixing-accessibility | 审查和修复 ARIA 标签、键盘导航、焦点管理、色彩对比度、表单错误 | 添加交互控件、表单、对话框或检查 WCAG 合规性时 |
/fixing-motion-performance | 审查和修复动画性能——layout thrashing、compositor 属性、scroll-linked motion、blur 效果 | 动画卡顿、过渡抖动或审查 CSS/JS 动画性能时 |
/fixing-metadata | 审查和修复 HTML 元数据——title、meta description、canonical URL、Open Graph、Twitter Card、JSON-LD | 添加 SEO 元数据、修复社交分享预览、上线新页面时 |
UI UX Pro Max
🔗 来源：nextlevelbuilder/ui-ux-pro-max-skill · 官网：uupm.cc
| Skill | 说明 | 触发场景 |
|---|---|---|
/ui-ux-pro-max | UI/UX 设计智能——50+ 风格、21 调色板、50 字体搭配、20 图表类型，支持 React/Next.js/Vue/Svelte/SwiftUI 等 9 个技术栈 | 规划、构建、设计、审查、优化 UI/UX 代码时 |
内置 Skills
| Skill | 说明 | 触发场景 |
|---|---|---|
/keybindings-help | 自定义 Claude Code 键盘快捷键，编辑 ~/.claude/keybindings.json | 需要重新绑定按键、添加 chord 快捷键时 |
/simplify | 审查已修改代码的复用性、质量和效率，自动修复发现的问题 | 完成代码编写后进行质量检查时 |
/claude-api | 使用 Claude API 或 Anthropic SDK 构建应用 | 代码中导入 anthropic / @anthropic-ai/sdk / claude_agent_sdk 时 |