Claude Code Skills Collection
A curated collection of Claude Code skills for generating diagrams and visualizations.
dtl-skills
Source: dingtingli/dtl-skills
This repository contains Claude Code skills, including:
- Claude Style Diagram - Generate diagrams in Claude's distinctive visual style
Community Skills (2026-04-20)
/make-interfaces-feel-better
作者: @jakubkrehel
安装: npx skills add jakubkrehel/make-interfaces-feel-better
链接: https://x.com/jakubkrehel/status/2045895877588361723
专注于 UI/UX 改进的 skill，可以通过一行命令安装到 Claude Code 中。
/make-pdf (GStack v1.4)
作者: Garry Tan (@garrytan) 链接: https://x.com/garrytan/status/2046097059057651941
GStack 的一部分，新增 PDF 生成功能。Garry Tan 的工作流：遇到需求让 Claude Code 实现，然后开源发布。
/grill-me + /create-doc
作者: @mattpocockuk 链接: https://x.com/mattpocockuk/status/2046150634756272527
两阶段文档生产方法论：
- /grill-me: 宽松的拷问会话，对齐想要创建的内容
- /create-doc: 基于对齐后的理解创建文档
适用于 PRD、技术文档、长邮件、博客文章等。
What are Claude Code Skills?
Skills in Claude Code are reusable instruction sets saved in SKILL.md files that Claude reads when encountering relevant tasks. They act as playbooks that sit on your machine, loaded automatically when Claude detects a matching request.
Skills follow an open standard and work across Claude Code, Cursor, Gemini CLI, Codex, and others - not vendor-locked.
Skill Locations
Personal skills (available across all projects):
~/.claude/skills/<skill-name>/SKILL.md
Project skills (scoped to one repo, shareable via Git):
.claude/skills/<skill-name>/SKILL.md
Project-level always overrides personal-level if both exist.
Source: dingtingli/dtl-skills
2026-05-14 更新
/handoff（mattpocock）
将对话压缩为 handoff 文件，让新 session 无缝接手。Codex 长任务上下文管理的最佳实践：在任务完成 70%-80% 时使用 handoff 压缩对话，新开 session 接手。已成为作者最高频使用的 skill。
改进方向：即将支持 HTML 输出（由 trq212 贡献），代码架构审查结果将以更可视化的方式呈现。
/grill-me 改进版（mattpocock）
原版用于代码审查，改进版转向通用设计审查。每天收到 5-10 条反馈，说明 skill 作为设计审查工具的需求真实存在。审查范围从代码扩展到设计决策、架构选择和需求理解。
代表 skill 设计趋势：从特定场景工具向可配置的通用审查框架演进。
html-anything（tuturetom）
开源项目，复现 Claude Code 作者提出的 HTML 输出理念。支持 75 套预设 Skills 和 9 种导出格式，兼容 Claude Code、Codex、OpenClaw、Hermes 等主流 code agent。
核心理念：Agent 不输出枯燥文本，而是直接生成可交互、设计精良的 HTML。这是 HTML 作为 AI 原生输出格式趋势的具体实现。
2026-06-01 更新
gsap-skills（GSAP 官方）
GSAP 官方发布的动画 skill，支持 Cursor、Claude Code、Copilot、Windsurf 等主流 Agent 自动识别。包含 25+ 高级动画实战案例，覆盖 Timeline、ScrollTrigger、Ease 等核心技能。GSAP 已全部免费（原 Club 高级插件免费开放），可商业项目直接使用，跨框架支持 React、Vue、Svelte 和原生 JS。
链接: https://x.com/IndieDevHailey/status/2060559034483359939
设计师级审美 skills（impeccable / taste / Frontend App Builder）
三个实测有效的设计 skill 方案：
- impeccable skill：综合表现优于 uiuxpromax 等热门设计 skill
- taste skill：核心用法是 imagegen-frontend-web skill 生成设计参考图 + image-to-code skill 1:1 还原
- Frontend App Builder skill（Codex 内置）：流程更工程化，对颜色、图标还原度要求更严格
完整设计落地可安装 Build Web Apps plugin，包含 shadcn/ui 组件和浏览器验收。
链接: https://x.com/Saccc_c/status/2060660829188403596
打工人必装 12 Skills 清单（@nini_incrypto_）
面向打工人的必备 Skills 清单，覆盖三大场景：
- 新手入门：agent-browser、find-skills、skill-creator、deep-research
- 开发工作：product-spec-builder、ui-prompt-generator、ui-ux-pro-max、dev-builder
- 文字工作：brainstorming、minimax 办公三件套、ppt-generator、humanizer-zh
优先安装 skill-creator 和 find-skills，建立技能发现和扩展的飞轮。
链接: https://x.com/nini_incrypto_/status/2060647507315617945
2026-05-28 更新
/slides（petergyang）
基于 HTML 生成精美动画演示文稿的 skill。作者演示了如何在几分钟内创建美观的动画幻灯片。
链接: https://x.com/petergyang/status/2059801947503530365
autoreview（steipete）
自动代码审查 skill，能在 PR 合并前自动深度审查代码，发现大量边界情况。审查过程有时需要运行数小时，说明其深度分析能力远超快速 lint 检查。该 skill 已开源，位于 openclaw/agent-skills 仓库中。与 crabbox.sh 并列为开发者 stack 中最有影响力的工具，显示 AI 辅助代码审查正成为主流实践。
链接: https://x.com/steipete/status/2059453909819654554
Skill 分层架构（mattpocockuk）
Matt Pocock 提出将 skills 分为两类：
- Model-invocable skills：由模型自动调用的 skills
- User-invocable skills（commands）：由用户显式触发的命令
示例：用户运行 /improve-codebase-architecture（command），该命令内部调用 /deep-modules（skill）。这种分层使 skill 系统更具组合性和可扩展性。
链接: https://x.com/mattpocockuk/status/2059576485111808071
/react-doctor（aidenybai）
自动诊断和修复 React 应用中坏代码的 CLI 工具。只需运行 npx react-doctor@latest 即可扫描整个 React 项目，发现代码异味和潜在问题，并生成可直接应用的修复建议。
链接: https://x.com/aidenybai/status/2059965808498230730
SkillOpt（Microsoft / akshay_pachaar）
Microsoft 开源的 agent skill 训练框架，可以通过类似神经网络训练的方式迭代优化 agent skills。支持定义 skill 的目标函数并进行自动化优化。
链接: https://x.com/akshay_pachaar/status/2059973902892994560
2026-06-07 更新
Skill 维护检查表（Voxyz_ai）
Skill 库会腐烂，需要像维护代码一样维护。参考检查表：
- 未触发 → 修复描述
- 误触发 → 缩小边界
- 引用旧状态 → 修复真相来源
- 重复同样错误 → 添加失败模式
- 模型已自然掌握 → 删除规则
- 长期未用 → 归档
最危险的 skill 是上次模型升级后没人更新过但仍在运行的那些。
链接: https://x.com/Voxyz_ai/status/2063017104240984194
/skillify（GBrain + GStack）
Garry Tan 与 GBrain/GStack 生态提出的工作流：
- 克隆 GBrain（Postgres-backed second brain，含 30 个 skill）
- 添加 GStack（23 个实战检验的斜杠命令 skill）
- 任何任务只做一次，然后输入 /skillify 将其转化为永久 skill
核心洞察：skill 就是提示词，一次性工作流应转化为可复用命令。
链接: https://x.com/Av1dlive/status/2063314381203738690
awesome codex skills 合集
人工精选的 1000+ skill 合集，覆盖 Claude Code、Gemini CLI、GitHub Copilot 等，分类包括文档、设计、开发、增长、数据、AI 应用、基础设施、agent 开发等。