Install · all 28 skills安装 · 全部 28 个 skill

From zero to auto-activating
in 60 seconds. 从零到自动激活
60 秒。

Claude Code Skills are just folders. Install once, and Claude auto-loads the matching skill every time your prompt triggers it — no @skill-name invocation needed. This page covers: install methods, per-skill trigger keywords, running design-review on your own HTML, and using the scaffold from outside this repo. Claude Code Skill 就是文件夹。装一次，之后你的 prompt 匹配到 TRIGGER，Claude 自动加载相应 skill —— 不用 @skill-name 手动调用。本页覆盖：安装方法、每个 skill 的触发关键词、用 design-review 验自己的 HTML、从 本仓外的项目使用脚本。

Install methods安装方法 Trigger reference触发关键词表 Run design-review跑 design-review
01Prerequisites前置条件 02Install methods安装方法 03Your first skill第一个 skill 04All 28 skills全部 28 个 skill 05Run design-review跑 design-review 06Cross-repo use跨仓使用 07Troubleshooting排错 08Contribute参与
01 · Prerequisites01 · 前置条件

What you need first. 先准备这些。

Claude Code is the CLI this skill collection plugs into. If you don't have it:

Claude Code 是这套 skill 依附的 CLI。如果还没装： 

# macOS / Linux
curl -fsSL claude.ai/install.sh | bash

# Or via npm
npm install -g @anthropic-ai/claude-code

For the design-review scaffold's runtime gates, you also need: 要跑 design-review 的运行时检查，还需要：

Skills other than design-review don't need Python/Node to run — they're just markdown Claude reads. design-review 之外的 skill 不需要 Python/Node —— 它们就是 Claude 读的 markdown。

02 · Install methods02 · 安装方法

One recommended path. Two alternatives. 一条推荐路径，两个替代。

Skills are plain folders. Clone the repo and copy a folder in — installed in 60 seconds. The single-file and symlink variants cover the remaining setups. Skill 就是普通文件夹。clone 仓库、把文件夹复制进去，60 秒装好。其余场景用单文件或 symlink 变体。

Recommended推荐

Clone + copy Clone + 复制

Clone once, copy each skill folder whole into ~/.claude/skills/ (every repo on your machine) or a project's .claude/skills/ (that repo only). Multi-file skills keep their scripts/ and references/, and it works on every Claude Code version. Restart your session afterwards. clone 一次，把 skill 文件夹整个复制进 ~/.claude/skills/（机器上所有仓库可用）或项目的 .claude/skills/（仅该仓库生效）。多文件 skill 的 scripts/ 和 references/ 原样保留，任何版本的 Claude Code 都能用。装完重启 session。

See it activate in 60 seconds看它 60 秒自动激活 
git clone \
  https://github.com/TbusOS/sky-skills.git
cd sky-skills

cp -r skills/anthropic-design \
      skills/design-review \
      skills/linux-kernel-dev \
      ~/.claude/skills/

— or, two variants for specific setups — —— 或者，两个特定场景的变体 ——

Single-file copy 单文件复制

Only four skills are a lone SKILL.md — skills-sync, design-planner, design-evolve, wechat-video-publisher. Those can live as one flat .md per project. Every other skill ships scripts or references and loses them this way: linux-kernel-dev alone is 233 files. 只有四个 skill 是光杆 SKILL.md —— skills-sync、design-planner、design-evolve、wechat-video-publisher，它们可以平铺成每个项目一个 .md。其余 skill 都带脚本或 reference，这样装会丢：linux-kernel-dev 一个就有 233 个文件。 

# from inside the sky-skills clone
cp skills/skills-sync/SKILL.md \
  ~/.claude/skills/skills-sync.md

Symlink 符号链接

Clone once to ~/sky-skills, point every project at it. git pull updates all of them at once. clone 一份到 ~/sky-skills，所有项目指向它。git pull 一次同步全部。 

cd your-project/.claude/skills
ln -s ~/sky-skills/skills/design-review .
03 · Your first skill03 · 第一个 skill

60 seconds from install to auto-activation. 60 秒从安装到自动激活。

Install anthropic-design (the style this page is rendered in), open your project in Claude Code, and type a prompt that contains one of the TRIGGER keywords:

装上 anthropic-design(这页就是这个 skill 渲染的)，在 Claude Code 里打开你的项目，写一句含 TRIGGER 关键词的 prompt： 

# Claude Code session
> make me a landing page in anthropic style with two feature cards
                              ^^^^^^^^^^^^^^^^^
                              TRIGGER matched

Claude scans every installed SKILL.md's frontmatter, sees "anthropic style" in the TRIGGER description, and silently loads the skill's templates, color tokens, and dos-and-donts. Your HTML output comes back in the anthropic aesthetic — without you ever typing @anthropic-design. Claude 扫每一个已装 SKILL.md 的 frontmatter，看到 TRIGGER 描述里匹配了 "anthropic style"，悄悄加载它的模板、色板 token、dos-and-donts。你的 HTML 产出就是 anthropic 美学 —— 你从没输入 @anthropic-design。

The whole point of a skill is folded expertise. You write one prompt, not a fresh style guide. skill 的核心是折叠好的专业知识。你只写一句 prompt，不用每次重新贴一份风格手册。
04 · Trigger reference04 · 触发关键词表

All 28 skills at a glance. 28 个 skill 一张表看完。

Trigger keywords are a rough guide — the full TRIGGER condition is in each skill's frontmatter. Claude's matcher is fuzzy: synonyms often work. The prompt-activated skills auto-load on a match; the evaluators, planner, and maintenance tools run via CLI or slash-command, noted inline. 触发关键词是大致指引，完整 TRIGGER 条件在每个 skill 的 frontmatter 里。Claude 的匹配是 fuzzy 的，同义词一般也能触发。靠 prompt 激活的 skill 匹配即自动加载；评审员、规划器、维护工具走 CLI 或斜杠命令，表里逐行标注。

SkillSkill Role角色 Sample trigger prompts · or how to invoke样例触发 prompt · 或怎么调用
Content / systems · 9内容 / 系统 · 9
linux-kernel-dev Kernel / drivers内核 / 驱动 "write a chardev driver", "add a platform_driver", "Kconfig this feature", "DT binding for …""写一个 chardev 驱动"、"加一个 platform_driver"、"给这个功能加 Kconfig"、"DT binding …"
wechat-video-publisher Narrated video配音视频 "make a WeChat-style narrated video", "edge-tts recording + ffmpeg subtitles", "publish a WeChat article""做一个微信风格的配音视频"、"edge-tts + ffmpeg 字幕"、"发一篇公众号文章"
doc-to-markdown PDF/DOCX → MDPDF/DOCX → MD "convert this PDF to markdown", "DOCX → MD with images", "batch scan PDFs""把这份 PDF 转成 markdown"、"DOCX 转 MD 带图片"、"批量扫描版 PDF"
md-to-pdf MD → PDFMD → PDF "render this markdown to PDF with Chinese fonts", "MD → PDF with bookmarks""把这份 markdown 渲成带中文字体的 PDF"、"MD → PDF 带书签"
tech-pdf-reader Read datasheets读规格书 "read this datasheet", "the timing diagram on p86", "check a pin table in the chip manual", "this PDF won't open / renders blank""看下这个 datasheet"、"读一下规格书"、"PDF 里的时序图"、"查芯片手册引脚表"、"这份 PDF 打不开 / 读不出来"
datasheet-reading Confirm one PDF fact查证 PDF 里的一个事实 "what does register CTRL1 bit 3 do", "the timing minimum for this bus", "is this pin connected to VDD", "is R47 fitted or NC", "confirm from the datasheet""查 datasheet"、"芯片手册寄存器定义"、"这个时序参数最小值"、"看图纸 / 原理图这个脚接哪"、"这颗料贴没贴(NC)"
hardware-3d Photoreal hardware 3D写实硬件 3D 图解 "a photoreal 3D explainer for this chip", "show the data flow inside the die", "how does this bus actually run", "make it look like the rendered videos""写实 3D"、"真实的芯片效果"、"硬件原理动画"、"芯片内部数据流"、"die 内部"、"总线怎么走"、"做成视频那种真实感"
explain-ladder Explain ladder: text < diagram < page < video讲解阶梯:文字 < 图 < 网页 < 视频 "用 STE 讲" (switch on, "停止" to switch off), "explain it so I can follow", "draw the relation", "a throwaway page for this log", "make a page I can filter", "an explainer video" (proposed, made only after a yes)"用 STE 讲"(说"停止"关掉)、"讲得我能看懂"、"画个图讲"、"看懂就扔"、"做个网页看看"、"可视化这份 log"、"讲解视频"(先提,点头才做)
kernel-explain Explaining kernel internals: big picture first讲内核原理:先全貌,后细节 "explain how the kernel's memory management works", "give me the big picture first", "why was it designed this way", "how did this evolve", "my notes are too detailed to remember", "kernel interview prep""讲内核原理"、"讲清楚 X 的原理"、"先讲整体框架"、"来龙去脉"、"为什么这么设计"、"怎么演变来的"、"讲义太细记不住"、"内核面试复习"
Design generators · 10设计生成器 · 10
apple-design HTML — apple.comHTML — apple.com "apple style landing", "SF Pro typography", "like apple.com""apple 风格落地页"、"SF Pro 字体"、"像 apple.com"
anthropic-design HTML — anthropic.comHTML — anthropic.com "anthropic style", "technical introduction", "explainer page", "editorial long-form page", "architecture / flow diagram""anthropic 风格"、"技术介绍页"、"原理讲解页"、"编辑式长文"、"架构图 / 流程图"
ember-design HTML — handcraftHTML — 手作 "ember style", "cream + chocolate + gold", "Aesop / Kinfolk feel", "handcraft editorial""ember 风格"、"奶油 + 巧克力 + 金色"、"Aesop / Kinfolk 气质"、"手作编辑"
sage-design HTML — Nordic quietHTML — 北欧安静 "sage style", "Nordic minimal", "reading-app feel", "botanical studio""sage 风格"、"北欧极简"、"阅读 app 感觉"、"植物工作室"
glass-design HTML — liquid glassHTML — 液态玻璃 "glass style", "glassmorphism", "liquid glass", "aurora dark showcase", "frosted panels""glass 风格"、"玻璃拟态"、"液态玻璃"、"aurora 暗色展示"、"毛玻璃面板"
eclat-design HTML — keynote / launchHTML — 发布会 / keynote "keynote / product-launch page", "cinematic launch deck", "one more thing style", "dark cinematic reveal""发布会 / keynote 风格"、"产品发布页"、"暗调电影感发布页"、"one more thing 风格"
lectern-design HTML — boardroom deckHTML — 会议室 deck "boardroom / business-briefing deck", "board review", "quarterly / KPI review", "agenda / minutes""会议室 / 商务汇报 deck"、"董事会评审"、"季度 / KPI 汇报"、"议程 / 纪要"
atelier-design HTML — product UIHTML — 产品界面 "atelier style", "dashboard / admin console", "SaaS app UI", "booking flow", "settings / sign-in screen", "warm peach glass""atelier 风格"、"仪表盘 / 控制台 / 后台"、"应用界面 / app UI"、"预订流"、"设置页 / 登录页"、"暖色玻璃 / 桃色渐变"
primer-design HTML — picture explainerHTML — 图解读本 "eli5", "explain like I'm five", "explain simply", "picture explainer", "primer style""小白也能看懂"、"讲人话"、"图解 / 科普页"、"给外行解释"、"给我妈讲讲"、"primer 风格"
relief-design HTML — technical diagrams in neumorphismHTML — 新拟态技术框图 "neumorphism", "soft UI", "relief style", "state machine / timing diagram / register bitfield / memory layout / clock tree", "architecture block diagram""新拟态"、"凹凸感"、"浮雕风格"、"relief 风格"、"状态机 / 时序图 / 寄存器位域 / 内存布局 / 时钟树"、"芯片内部框图"、"架构框图"
graphite-design HTML, animations, video frames — graphite pencil on warm paperHTML、动图、视频画面 — 暖纸上的石墨铅笔手绘 "pencil sketch", "hand-drawn", "whiteboard animation", "sketchy diagram / flowchart / architecture", "algorithm animation", "cinematic illustration", "hand-drawn wallpaper""手绘风"、"铅笔画风"、"素描风"、"白板动画"、"代码大白话动图"、"算法动图"、"手绘流程图 / 架构图"、"电影感插画"、"手绘壁纸"、"ai-doc 那种画风"
Harness tooling — evaluators / workflow / planner / maintenance · 8Harness 工具 —— 评审 / 工作流 / 规划 / 维护 · 8
design-review Evaluator评审员 Auto-invoked after any design-skill output. Or run manually via bin/design-review <html> — see §05.任何 design skill 产出后自动调用。或手动跑 bin/design-review <html> —— 见 §05。
design-taste Taste learning shared by all design styles所有设计风格共用的口味学习 "learn my taste", "remember what I like", "why does it look like this", "learn from this picture""越用越懂你"、"记住我的喜好"、"按我的口味画"、"为什么画成这样"、"参考这张图的风格"
gated-dual-clone Git workflowGit 工作流 "dual-clone workflow", "gateway repo", "protected-branch workflow", "set up dual clone""双仓库工作流"、"gateway 仓库"、"编译仓库"、"受保护分支工作流"
gated-dual-clone-audit Evaluator评审员 "audit dual clone", "verify the safety gates", "dual-clone drift" · or bin/gated-dual-clone-audit"审计双仓库"、"验证安全检查"、"检查 gated dual clone"；或跑 bin/gated-dual-clone-audit
doc-review-loop Doc review loop文档评审循环 "I need a decision doc", "set up a writer + reviewer loop", "harshly review this doc""我要一份决策书"、"写评审文档"、"建 writer + reviewer 评审循环"
design-planner Planner规划器 Auto-pairs with a design skill on a vague one-line brief ("make a page for X"). Or run bin/design-review --plan.一句话模糊需求（"做个 X 的页面"）时自动配合设计 skill。或跑 bin/design-review --plan。
design-evolve Self-evolution自进化 "make the design skills better over time", "let the system evolve its own rules", "auto-tune the generators""让设计 skill 越用越好"、"让系统自己进化规则"、"auto-tune 生成器"
skills-sync Maintenance维护 "check skills for updates", "sync skills", "update sky-skills" · or /skills-sync (also auto via hook)"检查 skills 更新"、"同步 skills"、"更新 sky-skills"；或跑 /skills-sync（也会经 hook 自动提示）
05 · Run design-review05 · 跑 design-review

Four gates. One command. 四道检查，一条命令。

After Claude produces HTML for you, before you ship it, run the gates — four mechanical, plus an optional LLM taste critic. They catch the classes of bugs that both you and the generator will miss.

Claude 给你产出 HTML 后、你发布前，跑一遍检查 —— 四道机器检查 + 一道可选的 LLM 口味评审。它们抓的正是你和生成器都会漏的那类 bug。

One command — same for local and cross-repo 一条命令 —— 本仓跨仓都一样 

# From the sky-skills repo — just pass the HTML
bin/design-review your-page.html

# From any other repo — tell the wrapper where the webroot is
bin/design-review --repo=/path/to/your-project \
                  --skill=anthropic \
                  --css=/path/to/your-project/local.css \
                  docs/landing.html

The wrapper runs (in order) verify.py → visual-audit.mjs → axe-audit.mjs → screenshot.mjs, with --ignore-intentional on by default to suppress the documented 3.12-contrast brand-intentional noise. Any step failing exits non-zero. Screenshots are saved to <repo>/shots/. Those are the four mechanical gates; add --critic (solo) or --multi-critic (4 specialists) to also prepare the LLM taste judgment. 壳按序跑 verify.py → visual-audit.mjs → axe-audit.mjs → screenshot.mjs，默认开 --ignore-intentional 消掉 3.12 brand-intentional 噪音。任一步 fail 整体 fail。截图存到 <repo>/shots/。这就是四道机器检查；加 --critic（solo）或 --multi-critic（4 专家）再准备 LLM 口味评审。

What each gate catches 每道检查各抓什么

Full rule list + every bug already catalogued: known-bugs.md · cross-skill-rules.md. 完整规则 + 所有已登记的 bug：known-bugs.md · cross-skill-rules.md。

06 · Cross-repo use06 · 跨仓使用

Use the scaffold from any repo. 从任何仓库使用 scaffold。

The design-review scripts are designed to work from outside sky-skills — for example, against a separate project that uses anthropic-design's CSS but adds its own overrides.

design-review 脚本设计成可以从 sky-skills 外面工作 —— 比如一个独立项目用了 anthropic-design 的 CSS 但有自己的 override。

Example · review an engram landing from sky-skills 例：在 sky-skills 这边审 engram 的 landing 

cd ~/code/sky-skills

bin/design-review \
  --repo=~/code/engram \
  --skill=anthropic \
  --css=~/code/engram/docs/assets/app.css \
  docs/en/index.html

The three flags to know: 要知道的三个 flag：

Auto-detection covers most cases. verify.py reads every <link rel="stylesheet" href=*.css> in the HTML and resolves them relative to the HTML's own directory. For simple cross-repo setups you often don't need --css at all. 自动识别已覆盖大部分场景。verify.py 读 HTML 里每个 <link rel="stylesheet" href=*.css> 并相对 HTML 目录解析。跨仓简单场景通常根本不用传 --css。

07 · Troubleshooting07 · 排错

When it doesn't work. 不灵的时候。

Claude doesn't auto-load my skill even when the prompt matches.Prompt 明明匹配了，Claude 没自动加载 skill。

Check .claude/skills/ in your project root. If the SKILL.md isn't there (or isn't a valid symlink), Claude can't match it. Also: the TRIGGER description is scanned literal — apple style matches, 苹果风 may not unless the TRIGGER includes Chinese keywords (all eleven design skills do). 检查项目根的 .claude/skills/。SKILL.md 不在那里(或 symlink 无效)，Claude 无法匹配。另外：TRIGGER 描述是字面扫的 —— "apple style" 匹配，"苹果风"不一定能(除非 TRIGGER 里包含中文；11 个设计 skill 都包含)。

verify.py reports undefined class but the class is defined in my own CSS.verify.py 报 "undefined class"，但那个 class 我自己 CSS 里有定义。

Make sure your HTML has a <link rel="stylesheet" href=…> pointing to that CSS, and the relative path resolves correctly. If the CSS is outside the HTML's directory tree, pass --css=<path> explicitly. 确认 HTML 里有 <link rel="stylesheet" href=…> 指向那份 CSS，且相对路径能正常解析。如果 CSS 在 HTML 目录树之外，显式传 --css=<path>。

visual-audit.mjs floods me with 3.12-contrast warnings.visual-audit.mjs 把 3.12 对比度告警刷屏了。

Pass --ignore-intentional (or just use bin/design-review, which sets it by default). That filters documented brand-intentional patterns like white on anthropic orange. Real new contrast bugs will still surface. 加 --ignore-intentional(或直接用 bin/design-review，它默认就加了)。会过滤已登记的 brand-intentional 模式(例如白字 × anthropic 橙)。真新的对比度 bug 依然会报。

playwright complains about missing Chromium.playwright 报找不到 Chromium。

Run npx playwright install chromium once. The visual-audit and screenshot scripts need the headless browser binary, installed separately from the playwright npm package. 跑一次 npx playwright install chromium。visual-audit / screenshot 需要 headless 浏览器二进制，和 playwright npm 包分开装。

The hero diagram text is rendered below 9px even though I set font-size="10".SVG 源码写了 font-size="10"，渲染出来却 < 9px。

This is the scale issue: effective_px = font-size × (rendered_width / viewBox_width). If your container is narrower than the viewBox, the scale is < 1 and source 10 becomes effective < 10. Rule of thumb: source font-size ≥ 11 in hero diagrams. Or widen the container (use --hero or --wide modifier in the design skills). 是 scale 问题：effective_px = font-size × (渲染宽度 / viewBox 宽度)。容器比 viewBox 窄，scale < 1，源码 10 渲染下来 < 10。经验：hero 图里源码 font-size ≥ 11，或者加宽容器(设计 skill 里用 --hero / --wide modifier)。

08 · Contribute08 · 参与

Stuck? Idea for a new skill? 卡住了?有新 skill 的想法?

Open a discussion for use-cases and design proposals. Open an issue for actual bugs or missing features. Both are read. Use-case 和设计提案用 Discussion。真 bug 或缺失功能用 Issue。两边都会看。

Open a discussion开一个 discussion File an issue提一个 issue Read the harness roadmap读 harness 路线图 Back to sky-skills返回 sky-skills
09 · Stay updated09 · 保持更新

Install once — then Claude tells you when there's an update. 装一次 —— 以后远端更新了，Claude 会主动告诉你。

Cloned the repo and worried you'll drift behind? Install the auto-updater once. Then, on session start and (throttled) while you work, Claude checks the remote and — if it's ahead — tells you what's new and asks whether to update. It never touches your repo on its own.

clone 下来怕跟丢？装一次自动更新器即可。之后开会话时、做事中（节流），Claude 会检查远端，领先了就告诉你更新了啥、问你要不要更新。它绝不擅自改你的仓库。

# once, inside your sky-skills clone (--dry-run shows what it would do)
bash autoupdate/install.sh
# restart Claude Code to pick it up
# 在你的 sky-skills clone 里，装一次（先看会做啥可加 --dry-run）
bash autoupdate/install.sh
# 重启 Claude Code 生效

When the remote is ahead, Claude opens with something like this: 当远端领先时，Claude 会这样开口： 

sky-skills remote is 3 commits ahead:
· feat: kernel skill gains a testing axis (7-axis scoring panel)
· docs: survey page on code review methods
· feat: cpufreq / cpuidle / devfreq subsystems
Update now? Say yes and I run git pull + link any new skills.
sky-skills 远端领先 3 个提交：
· feat: 内核 skill 加测试维度（7 轴打分面板）
· docs: code review 方法调研页
· feat: cpufreq / cpuidle / devfreq 三个子系统
要现在更新吗？确认后我跑 git pull + 给新 skill 补 symlink。

Say yes and it runs git pull --ff-only + links any new skills. Check anytime yourself with /skills-sync. Watch more than one repo by adding lines to ~/.claude/sky-skills-autoupdate.repos. 你说"更新"它就跑 git pull --ff-only + 给新 skill 补 symlink。也可随时用 /skills-sync 主动查。想盯多个仓，往 ~/.claude/sky-skills-autoupdate.repos 加几行即可。

Installed once, it works in every session on this machine — any directory — because the config lives at user level and watches the clone by absolute path, independent of where you start. And it's not just Claude Code: the installer detects and wires up whichever of Claude Code, Codex, and Gemini CLI you have — all three share the same hook + additionalContext mechanism (Gemini uses BeforeAgent in place of UserPromptSubmit). 装一次，本机这个用户在任何目录开会话都生效——配置在用户级，按绝对路径盯着 clone，跟你在哪开会话无关。而且不止 Claude Code：安装器会探测并接入你装了的 Claude Code、Codex、Gemini CLI——三家共用同一套 hook + additionalContext 机制(Gemini 用 BeforeAgent 代替 UserPromptSubmit)。

Claude Code doesn't poll in the background — so the check rides its lifecycle hooks (session start + prompt submit). Detection is read-only; the pull only happens after you say yes. Claude Code 不会后台轮询 —— 所以检查挂在它的生命周期 hook 上（开会话 + 提交 prompt）。检测只读；只有你点头后才真的拉取。