by helloianneo
Claude Code 最实用的 Skills / Agents / Plugins 精选合集 | 50+ 精选 | 按场景分类 | 带推荐等级 | 复制即装
# Add to your Claude Code skills
git clone https://github.com/helloianneo/awesome-claude-code-skillsGuides for using ai agents skills like awesome-claude-code-skills.
Last scanned: 5/30/2026
{
"issues": [],
"status": "PASSED",
"scannedAt": "2026-05-30T15:45:03.476Z",
"npmAuditRan": true,
"pipAuditRan": true
}awesome-claude-code-skills is an open-source ai agents skill for AI coding assistants such as Claude Code, Codex CLI, and ChatGPT, built by helloianneo. Claude Code 最实用的 Skills / Agents / Plugins 精选合集 | 50+ 精选 | 按场景分类 | 带推荐等级 | 复制即装. It has 318 GitHub stars.
Yes. awesome-claude-code-skills passed SkillsLLM's automated security scan — a dependency vulnerability audit plus prompt-injection heuristics — with no high-severity issues. You can read the full report in the Security Report section on this page.
Clone the repository with "git clone https://github.com/helloianneo/awesome-claude-code-skills" and add it to your Claude Code skills directory (see the Installation section above).
Yes. SkillsLLM lists many other AI Agents skills you can browse and compare side by side. Open the AI Agents category from the badge at the top of this page, or use the Related Skills and comparison links further down to weigh awesome-claude-code-skills against similar tools.
No comments yet. Be the first to share your thoughts!
Claude Code 最实用的 Skills / Agents / Plugins 精选合集,按场景分类,带安装命令,复制即用。
50+ 精选 | 按场景分类 | 带推荐等级 | 持续更新
Claude Code 的 Skill 生态爆发了,但好东西散落在 GitHub、skills.sh、lobehub 各处,找起来费劲。
这个仓库帮你筛过一遍:
必装 > 强推 > 好用 > 可选怎么安装 Skill:
# 通用安装方式
npx skills add <作者>/<仓库>@<skill名>
# 例子
npx skills add vercel-labs/agent-skills@web-design-guidelines
# 查看已安装
npx skills list
不管你做什么方向,这 10 个装了不亏。
| # | Skill | 作者 | 一句话 | 安装 |
|---|---|---|---|---|
| 1 | Frontend Design | Anthropic | 官方出品,让 UI 不像 AI 生成的 | npx skills add anthropics/skills@frontend-design |
| 2 | Context7 | intellectronica | 上下文窗口内实时拉 API 文档,不用再贴链接 | npx skills add intellectronica/agent-skills@context7 |
| 3 | Web Design Guidelines | Vercel Labs | 对照 100+ 最佳实践审查你的 UI | npx skills add vercel-labs/agent-skills@web-design-guidelines |
| 4 | UI-UX-Pro-Max | Next Level Builder | 视觉层级 x 色彩心理学 x 交互模式 | npx skills add nextlevelbuilder/ui-ux-pro-max-skill@ui-ux-pro-max |
| 5 | Emil Kowalski's Skill | Emil Kowalski | 设计 + 动效 + 代码 + 性能,全栈审美 | npx skills add emilkowalski/skill |
| 6 | Superpowers | obra | TDD / 并行 Agent / 代码审查 / Git 工作流 | npx skills add obra/superpowers |
| 7 | shadcn/ui | shadcn | 官方组件管理 + 表单 + 预览 | npx skills add shadcn/ui@shadcn |
| 8 | Remotion | Remotion | React 驱动的视频生成,30+ 规则 | npx skills add remotion-dev/skills@remotion-best-practices |
| 9 | Tailwind CSS | hairyf | Tailwind v4 完整支持 | npx skills add hairyf/skills@tailwindcss |
| 10 | Find Skills | Vercel Labs | 让 Agent 自己发现和安装新 Skill | npx skills add vercel-labs/skills@find-skills |
让 AI 出的设计不再有「模板感」。
| Skill | 作者 | 推荐 | 一句话 | 安装 |
|---|---|---|---|---|
| Frontend Design | Anthropic | 必装 | 官方设计系统哲学,大胆配色 + 有辨识度的字体 + 有意图的动效 | npx skills add anthropics/skills@frontend-design |
| UI-UX-Pro-Max | Next Level Builder | 必装 | 视觉层级 x 色彩心理学 x 交互模式,出图质量显著提升 | npx skills add nextlevelbuilder/ui-ux-pro-max-skill@ui-ux-pro-max |
| Emil Kowalski's Skill | Emil Kowalski | 必装 | 来自 Sonner / Vaul 作者的设计 + 动效 + 代码实践 | npx skills add emilkowalski/skill |
| Web Design Guidelines | Vercel Labs | 必装 | 对照 100+ 最佳实践审查 UI,找出细节问题 | npx skills add vercel-labs/agent-skills@web-design-guidelines |
| Make Interfaces Feel Better | Jakub Krehel | 强推 | 对齐 / 阴影 / 间距 / 圆角的细节打磨 | npx skills add jakubkrehel/make-interfaces-feel-better |
| Figma Designer | Anthropic | 好用 | Claude 进入 Figma 高级设计师思维模式 | npx claude skills add figma |
| Theme Factory | Anthropic | 好用 | 10 套配色 + 字体主题,套用到任意 artifact | npx claude skills add theme-factory |
| Brand Guidelines | Anthropic | 好用 | Anthropic 官方品牌规范(色 / 字 / 视觉) | npx claude skills add brand-guidelines |
| Canvas Design | Anthropic | 好用 | 生成海报 / 插画,输出 PNG / PDF | npx claude skills add canvas-design |
| SuperKit UI/UX | Pixel Process UG | 好用 | 50+ 风格 / 97 色板 / 57 字体配对 | npx skills add Pixel-Process-UG/superkit-agents |
| TypeUI Design Skills | TypeUI | 可选 | 手工 skill 文件,复现特定视觉风格 | npx typeui.sh pull [name] |
| Design.md Generator | Google Labs | 好用 | 分析项目 → 自动生成 DESIGN.md 设计规范 | npx skills add google-labs-code/stitch-skills@design-md |
| Brainstorming | obra | 强推 | 验证设计方案后才允许写代码,防止 AI 乱写 | npx skills add obra/superpowers@brainstorming |
组件库、框架支持、开发效率。
| Skill | 作者 | 推荐 | 一句话 | 安装 |
|---|---|---|---|---|
| shadcn/ui | shadcn | 必装 | 官方组件管理 + 表单 + 预览 | npx skills add shadcn/ui@shadcn |
| Context7 | intellectronica | 必装 | 上下文窗口内实时拉准确 API 文档 | npx skills add intellectronica/agent-skills@context7 |
| Tailwind CSS | hairyf | 必装 | Tailwind CSS v4 完整支持 | npx skills add hairyf/skills@tailwindcss |
| Tailwind Design System | WS Hobson | 强推 | CSS-first 设计系统 + OKLCH 色彩 | npx skills add wshobson/agents@tailwind-design-system |
| Find Skills | Vercel Labs | 强推 | 让 Agent 自己发现和安装新 Skill | npx skills add vercel-labs/skills@find-skills |
| React Best Practices | Vercel Labs | 强推 | 45 条 React/Next.js 性能优化规则 | npx skills add vercel-labs/agent-skills@react-best-practices |
| Ralph Loop | Frank Bria | 好用 | 多小时自主编码 Agent,适合长任务 | npx skills add frankbria/ralph-claude-code |
让页面动起来,或者直接生成视频。
| Skill | 作者 | 推荐 | 一句话 | 安装 |
|---|---|---|---|---|
| Remotion | Remotion | 必装 | React 驱动的视频生成,30+ 规则,3D / 图表 / 参数化内容 | npx skills add remotion-dev/skills@remotion-best-practices |
| Motion (Framer Motion) | Jezweb | 强推 | React 动画:手势 / 滚动 / 弹性 / 布局 | npx skills add jezweb/claude-skills@motion |
| Animation Systems | Guilherme | 强推 | Stripe / Linear / Apple 级别网页动效 | npx skills add guilhermemarketing/gui-marketing-skills@animation-systems |
| AI Video Generation | inference.sh | 好用 | 40+ AI 视频模型(Veo / Wan / Grok) | npx skills add inferen-sh/skills@ai-video-generation |
| Nano Banana 2 | inference.sh | 好用 | Gemini 文字转图 / 图片编辑,4K 输出 | npx skills add inferen-sh/skills@nano-banana-2 |
从 SEO 审查到文案撰写到定价策略。
| Skill | 作者 | 推荐 | 一句话 | 安装 |
|---|---|---|---|---|
| SEO Audit | Corey Haines | 强推 | 五优先级 SEO 全面审查框架 | npx skills add coreyhaines31/marketingskills@seo-audit |
| Copywriting | Corey Haines | 强推 | 主页 / 落地页 / 定价页转化文案 | npx skills add coreyhaines31/marketingskills@copywriting |
| Product Marketing Context | Corey Haines | 好用 | 产品定位 / 人群 / 竞品 / 品牌声音 | npx skills add coreyhaines31/marketingskills@product-marketing-context |
| Pricing Strategy | Corey Haines | 好用 | SaaS 定价设计与竞品对比框架 | npx skills add coreyhaines31/marketingskills@pricing-strategy |
| Twitter Automation | inference.sh | 可选 | 推文 / 点赞 / 转推 / DM,9 个命令 | npx skills add inferen-sh/skills@twitter-automation |
代码审查、测试、调试。
| Skill | 作者 | 推荐 | 一句话 | 安装 |
|---|---|---|---|---|
| Superpowers | obra | 必装 | TDD / 并行 Agent / 代码审查 / Git 工作流,一套全有 | npx skills add obra/superpowers |
| Code Review | Supercent | 强推 | 自动代码审查(注释 / 测试 / 类型 / 质量) | npx skills add supercent-io/skills-template@code-review |
改变 Claude Code 的工作方式。
| Skill | 作者 | 推荐 | 一句话 | 安装 |
|---|---|---|---|---|
| Superpowers - TDD | obra | 必装 | 强制测试驱动开发:写测试 → 实现 → 重构 | npx skills add obra/superpowers@test-driven-development |
| Superpowers - Parallel Agents | obra | 强推 | 多个子 Agent 并行执行独立任务 | npx skills add obra/superpowers@dispatching-parallel-agents |
| Superpowers - Plan Mode | obra | 强推 | 先规划再执行,防止 AI 乱改代码 | npx skills add obra/superpowers@writing-plans |
| Superpowers - Git Worktrees | obra | 好用 | 隔离工作区,不影响主分支 | npx skills add obra/superpowers@using-git-worktrees |
| Skill | 作者 | 推荐 | 一句话 | 安装 |
|---|---|---|---|---|
| Web Accessibility | Supercent | 好用 | 对比度 / 键盘导航 / 语义结构检查 | npx skills add supercent-io/skills-template@web-accessibility |
不知道该装什么?先看这些合集。
| 资源 | 说明 | 链接 |
|---|---|---|
| Awesome Agent Skills | VoltAgent 维护,549+ skills,分类最全 | GitHub |
| Awesome Claude Code Toolkit | Rohit Ghumare 维护,135 agents + 35 skills | GitHub |
| Awesome Claude Code | hesreallyhim 维护,skills + hooks + 命令 | GitHub |
| **skil |