xhyapi
视频来源：Bilibili 原视频
这一期不讲概念，直接开箱：把我平时真在用的一份 Skills 清单摊开——从前端设计、代码审查，到生图、视频、PPT，19 个 Skills 覆盖 7 大场景，每个都附来源和安装方式。不是「什么都收藏」的资源列表，而是每天在用、验证过的。
先认清 3 个安装渠道，装错渠道是新手第一坑
- npx skills 生态：开放生态包管理器，本清单大多数 Skill 走这里，一条命令装完即用；
- 独立 CLI 工具：本体是命令行程序，走 npm / brew 装，可能有安装后步骤；
- 放进 ~/.codex/skills：兜底也最本质——任何 skill 说到底就是个文件夹，丢进这个目录就生效；插件类（如 frontend-design）在 Codex 里也这么用。
# 渠道一：skills CLI（本清单大多数，跨工具通用）
npx skills add nextlevelbuilder/ui-ux-pro-max-skill
# 渠道二：独立 CLI，注意安装后步骤
npm i -g agent-browser && agent-browser install
# 渠道三：任何 skill 文件夹放进 ~/.codex/skills 即生效
git clone <repo> ~/.codex/skills/frontend-design19 个 Skills × 7 大场景
| 场景 | Skill | 来源 | 一句话 |
|---|---|---|---|
| 01 前端设计 | ui-ux-pro-max | nextlevelbuilder | 67 种 UI 风格、161 套配色、99 条 UX 规范，按需求生成完整设计系统 |
| make-interfaces-feel-better | jakubkrehel | 微动效、过渡、手感层面的打磨，让界面更有质感 | |
| frontend-design | Anthropic 官方 | 给界面视觉个性，专治「一眼 AI 味」的模板化默认样式 | |
| 02 管理与发现 | find-skills | Vercel Labs | 说一句「有没有能做 X 的 skill」，帮你发现并安装 |
| skill-manager | xhyqaq（自研） | 以 ~/.skills 为唯一来源，软链分发到 ~/.codex/skills，装多了不乱 | |
| darwin-skill | alchaincyf | 评估、改进、实测、保留或回滚，让 skill 分数只升不降地自我进化 | |
| 03 工程效率 | web-project-standards | xhyqaq（自研） | 为 TS 全栈项目一键生成 AI 友好的规范文档，起新项目时用 |
| superpowers | obra | 设计 → 规划 → 实现的完整方法论，内置 TDD、审查、系统化调试 | |
| clean-code-reviewer | ZLStas | 按《Clean Code》11 类原则审代码，按严重度标注，附重构示例 | |
| 04 操作自动化 | agent-browser | Vercel Labs | AI 专用浏览器自动化 CLI：填表、点击、截图、抓数据、E2E 测试 |
| cli-anything | HKUDS | 给任意有源码的 GUI 软件自动生成生产级 CLI，AI 不用鼠标也能操作 | |
| 05 生图 | GPT-Image2-Skill | wuyoscar | 30+ 分类的生产级 prompt 精选库 + CLI，装进 agent 工作流直接生图 |
| awesome-gpt-image-2 | freestylefly | 500+ 逆向 prompt 整理成可组合、可批量调用的结构化模板库 | |
| 06 视频与 PPT | video-podcast-maker | Agents365-ai | 给一个主题，研究 → 脚本 → 配音 → 渲染一条龙出 4K 视频播客 |
| remotion-best-practices | Remotion 官方 | React 做视频的 39 个规则文件：动画、音频、字幕、转场少踩坑 | |
| html-ppt | lewislulu | 纯静态 HTML 写专业幻灯片，token 设计系统 + 键盘翻页 | |
| 07 设计稿·克隆·整理 | design.md | Google Labs | 机器可读 token + 人类可读说明，让 AI 出的 UI 不再风格漂移 |
| firecrawl-website-design-clone | Firecrawl 官方 | 抓取目标网站结构与设计再还原成代码，23K+ 安装断层领先 | |
| neat-freak | KKKKhazix | 干完活调用一下，把旧文档、记忆和新代码对齐，不让知识烂在仓库 |
顺序不重要——按你最近手头的活儿挑着装，别一口气全装上。19 个 Skill 的完整地址、安装命令和场景备注，都在这份持续更新的清单里：Agent Skills 推荐清单。
装之前，先看这 6 条备注
| Skill | 注意 | 正确姿势 |
|---|---|---|
| frontend-design | 装法和别的不同 | 放进 ~/.codex/skills 用（/plugin 是 Claude Code 的方式） |
| ui-ux-pro-max | 有两种装法 | 官方推荐自带 CLI：uipro init --ai codex --global；npx skills add 是备选 |
| agent-browser | 装完不等于能用 | npm / brew 装完，再跑 agent-browser install 下载浏览器 |
| 生图两件套 | 不是零成本 | 依赖 OpenAI 图像模型，先配好对应 API key |
| firecrawl-…-clone | 要 key，还要讲版权 | 有免费额度；只用于学习或有授权的场景 |
| video-podcast-maker | 以为要钱？不用 | 默认 edge-tts 免费无需 key，本地 Remotion + FFmpeg 零成本出片 |
上手路径
别让 19 个停在收藏夹里：先装 find-skills（负责找）→ 再装 skill-manager（负责管）→ 然后按手头的活儿按需装。用起来的才叫生产力。
Skills 三部曲
- 04-1 入门：别再复制提示词了，让 Codex 记住你的工作方法
- 04-2 工具箱：我每天在用的 19 个 Codex Skills，7 大场景直接抄（本篇）
- 04-3 动手做：你的第一个 Codex Skill，是被「烦」出来的
