ConardLi/garden-skills：AI编码智能体生产级技能库

精选的生产级 AI 智能体技能集合，适用于 Claude Code、Cursor、Codex 等 AI 编程智能体。

web-video-presentation

分类：Web 视频 / 演示工程 适用场景：将脚本、文章、课程、产品演示和演讲转化为可点击驱动的 16:9 网页演示文稿，可录制为电影感视频。

web-video-presentation 构建可直接录制的 Vite + React + TypeScript 演示文稿，其表现形态如同专业视频制作界面。该工作流将原始文章转化为配音脚本，将脚本节奏映射到全屏场景，在关键节点暂停，并在视觉大纲审批通过后可选地合成配音音频。

固定 1920×1080 舞台，自适应视口缩放，保证屏幕录制稳定性

点击/键盘驱动（章节、步骤）光标，每个视觉步骤对应一个配音节奏点

硬性协作检查点：脚本、主题、大纲、实施模式、可选音频

悬停时仅显示的进度控制条，录制时舞台画面保持干净

主题令牌架构，内置 23 套主题，每套主题有独立的设计签名——社论风、终端风、工程风、瑞士国际风等

可插拔 TTS——provider 无关联的音频运行器；内置两个 provider（MiniMax mmx-cli + OpenAI TTS via curl），同时提供 ElevenLabs / edge-tts / Azure / Google Cloud / macOS say 的合约代码和可直接粘贴的片段

脚手架化的 Vite + React + TypeScript 项目，包含可复用舞台组件和录制指南

↑ 23 套主题一览——打开完整画廊查看实时 16:9 预览、设计签名和适用场景标签。

相关链接：README · SKILL.md · 下载 v1.2.2 .zip

分类：设计 / 前端 适用场景：网页、着陆页、仪表盘、交互原型、HTML 幻灯片、动画、UI 草图、数据可视化、设计系统探索。

web-design-engineer 将 AI 生成的网页产物从"勉强能用"提升为精致、意图明确、令人印象深刻的前端作品。它将 AI 智能体视为设计工程师：首先理解产品背景，然后声明设计系统，展示早期 v0，构建完整体验，最后验证结果。

将需求简报转化为涵盖五个维度的 Design Read：差异性、运动感、密度、资产依赖度、品牌还原度

在修改现有产品前，区分扩展模式、保留模式和重构模式

仅在用户明确要求验收、QA 或浏览器测试时，才运行可执行的浏览器验收流程

超越通用 AI UI 模式，配备反刻板印象黑名单和更强的视觉判断力

提供设计方向顾问（六种差异化风格流派）+ 25 个锚定风格配方（Linear / Aesop / Pentagram / Bloomberg / Stripe Press / Mid-Century 等）——每个配方都附带具体的色板、字体排版、标志性手法和反模式，可直接粘贴到设计系统声明中

覆盖 HTML / CSS / JavaScript / React 原型，并提供响应式布局、动效和交互细节的指导

包含内联 React + Babel、CSS 令牌、oklch() 色彩工作、容器查询和减少动画处理的实用实现规则

附带高级模式参考：设备边框、幻灯片引擎、动画时间线、仪表盘及其他可复用的网页产物

↑ 12 个锚定配方——打开完整画廊查看全部 25 个工作产物（药铺页面、交易工作站、杂志封面、Y2K 门户、中世纪海报……）及其标志性手法和适用场景标签。

相关链接：README · SKILL.md · 网站 · 演示 · 下载 v1.3.0 .zip

分类：图像生成 / 提示词工程 适用场景：海报、UI 草图、产品图、信息图、学术图表、技术图表、漫画、头像、故事板、品牌板、图像编辑工作流。

gpt-image-2 是面向 GPT Image 2 和 OpenAI 兼容图像 API 的专注图像生成技能。设计用于跨不同智能体环境工作：完全本地化的 Garden 生成、宿主原生图像工具委托，或在无可用图像工具时作为纯提示词顾问模式。

支持三种运行时模式：模式 A Garden 本地化、模式 B 宿主原生委托、模式 C 仅顾问提示词编写

每个任务都以模式检测开始，确保技能不会静默选择错误的执行路径

在 references/ 下提供 18 个视觉类别和 79 个结构化提示词模板

通过专用工作流和脚本覆盖图像生成和图像编辑两种能力

在 Garden 模式下将提示词和生成的图像保存至 garden-gpt-image-2/，便于复用、审查和版本管理

↑ 从 160+ 公开案例库中精选的 12 个案例——打开技能画廊获取更多模板，或浏览在线网站。

相关链接：README · SKILL.md · 网站 · 下载 v1.0.4 .zip

分类：检索 / 本地知识库 适用场景：从本地 knowledge/ 目录回答问题、搜索结构化文档、从 Markdown、文本、PDF 和 Excel 文件中提取证据，且不造成智能体上下文泛滥。

kb-retriever 是一个基于谨慎、渐进式检索的本地知识库检索器。它不会一次性加载整个文件，而是导航层级索引文件、缩小候选集、正确处理复杂文件类型，然后给出带来源的答案。

使用分层的 data_structure.md 文件导航知识库，再进入内容搜索

对 PDF 和 Excel 文件强制"先学习再处理"规则，在提取或分析前使用附带的参考文档

结合精确关键词搜索、本地窗口读取、同义词替换和迭代优化

将检索限制在最多 5 轮搜索轮次，保证探索过程受控

包含 grep、pdftotext、pdfplumber 和 pandas 的工作流，并带来源感知的答案格式化

相关链接：README · SKILL.md · 下载 v1.0.1 .zip

分类：编辑 · 任意来源 → 精美文章 适用场景：将 URL、PDF、DOCX、Markdown、纯文本、截图和粘贴的笔记转化为可发布的精美文章——长文、简报、解读、教程、复盘、视觉散文、对话实录。

beautiful-article 是一种编辑加工技能：它不仅仅是"生成一个网页"，而是对原始素材进行编辑和设计，将其打磨成一篇比原文更易于阅读、分享和归档的精致文章。该技能遵循一个小型的 source → plan → double-confirmation → build → final review → repair 循环，并在三个硬性检查点暂停，以便用户对文章类型、主题、布局、图片策略、封面和发布格式保持编辑控制权。

文章优先——核心是文章：更好的阅读体验、更好的节奏、更好的美学呈现。交付物是一个自包含文件（HTML，可选 PDF），但这只是交付细节，不是目标。

Reacticle 组件协议——以散文为先的语义组件（Hero / Lead / Section / Quote / Callout / Image / Formula / CodeBlock / Table…）加上仅使用主题 Token 的 Raw 自由层；底层 React 库位于 ConardLi/reacticle

10 种文章类型及对应的留存率——长文 · ~100% / 教程 · ~90% / 完整报告 · ~80% / 解释性文章 · ~80% / 对话体 · ~80% / 评测 · ~70% / 随笔 · ~70% / 简报 · ~50% / 视觉随笔 · ~40% / 交互式解读 · ~25% 摘要 + 75% AI 重建

11 种创作主题配置（tufte, press, bayer, bodoni, vignelli, sottsass, freddie, andy, fuller, knuth, shannon）——每种都是面向 AI 智能体的 Markdown 契约，而非 CSS 文件

硬性协作检查点，逐项决策捕获（无静默默认值），加上 3:4 书籍风格封面、默认开启的目录，以及语言感知的翻译步骤

逐节点质量协议——主智能体内联检查 plan，各子智能体审阅者负责首屏 / 各节 / 最终 review，repair 以最小切片为单位

链接：README · SKILL.md · 下载 v0.1.0 .zip

共有五种支持的安装路径。选择适合你技术栈的一种：

每个技能章节上方的"链接："行中也有"下载 v<版本> .zip"链接，指向当前固定发布的产物文件。这些 URL 由 scripts/release/update-readme.mjs 在每次发布时自动重写，因此始终指向最新的不可变版本。

选项 A · skills CLI（npx）

最快速的与智能体无关的安装路径。使用标准的 npx skills CLI，可自动检测你的智能体（Claude Code、Cursor、Codex 等）并将技能安装到正确目录。

# 安装全部四个技能（最新版本）
npx skills add ConardLi/garden-skills

# 仅安装一个技能（最新版本）
npx skills add ConardLi/garden-skills -s web-design-engineer

# 全局安装（~/.skills）而非项目级安装（./.skills）
npx skills add ConardLi/garden-skills -s gpt-image-2 --global

# 指定目标智能体
npx skills add ConardLi/garden-skills -s kb-retriever -a claude-code

默认使用 main 分支的最新提交。这是大多数时候你想要的结果——CLI 从源码树直接追踪每个技能最新发布的 SKILL.md。

想要固定版本？（CI / 生产环境）使用带 tag 作用域的 tree/ URL——这会指向发布时所切出的确切提交：

# 将一个技能固定到特定版本
npx skills add ConardLi/garden-skills/tree/web-design-engineer-v1.0.0/skills/web-design-engineer

对于每个技能，当前的固定 .zip URL 也显示在上面其"链接："行的内联位置（下载 v<版本> .zip 链接）。

npx skills list                 # 查看已安装内容
npx skills find web-design      # 搜索注册表
npx skills update               # 升级所有技能
npx skills remove kb-retriever  # 卸载

选项 B · Claude Code 插件市场

如果你使用 Claude Code，可以订阅市场并安装捆绑了一个或多个技能的插件包：

/plugin marketplace add ConardLi/garden-skills
/plugin install presentation-skills@garden-skills
/plugin install web-design-skills@garden-skills
/plugin install knowledge-base-skills@garden-skills
/plugin install image-generation-skills@garden-skills

插件包在 .claude-plugin/marketplace.json 中声明。

选项 C · 来自 Releases 的固定 .zip

每次正式发布都会将一个不可变的 .zip（带有 SHA-256 校验和）发布到 GitHub Releases。当你需要精确的字节永远不变时，从 CI、Dockerfile 或气隙安装程序中固定到这个。

# 将 <skill> 和 <version> 替换为你想要的版本。
SKILL=web-design-engineer
VERSION=1.0.0

curl -fsSL -o "${SKILL}.zip" \
  "https://github.com/ConardLi/garden-skills/releases/download/${SKILL}-v${VERSION}/${SKILL}-${VERSION}.zip"

# 验证校验和（对于无人值守安装强烈建议执行）
curl -fsSL -o "${SKILL}.zip.sha256" \
  "https://github.com/ConardLi/garden-skills/releases/download/${SKILL}-v${VERSION}/${SKILL}-${VERSION}.zip.sha256"
shasum -a 256 -c "${SKILL}.zip.sha256"

# 将文件夹放入智能体的 skills 目录
unzip -q "${SKILL}.zip" -d .claude/skills/   # 或者 .agents/skills/、.codex/skills/、...

也可以使用浮动的"始终获取最新"URL——适合一次性安装：

https://github.com/ConardLi/garden-skills/releases/latest/download/<skill>-<version>.zip

每个技能的固定 URL 都列在本 README 的内联位置——参见上面每个技能"链接"条目下的"下载"行。这些 URL 由发布流水线自动保持同步。

选项 D · 手动复制到项目中

克隆仓库并复制你想要的技能文件夹——如果你想 fork 或修改技能本身，这种方式很方便。

git clone https://github.com/ConardLi/garden-skills.git
cp -r garden-skills/skills/web-design-engineer  your-project/.claude/skills/
# Cursor / 通用智能体：
cp -r garden-skills/skills/web-design-engineer  your-project/.agents/skills/

智能体在下一次扫描工作区时会发现该技能。

选项 E · Git submodule

对于想要追踪上游更新的大型项目，可以 vendoring 到项目中：

git submodule add https://github.com/ConardLi/garden-skills.git vendor/garden-skills
ln -s ../../vendor/garden-skills/skills/web-design-engineer .claude/skills/web-design-engineer

固定到发布标签以保证可重现性：

cd vendor/garden-skills
git checkout web-design-engineer-v1.0.0

SKILL.md 格式在设计上具有可移植性——如果你的智能体支持 skills，将文件夹复制到它扫描的目录中，它就应该能工作。欢迎提交 PR 来扩展这个矩阵。

一个 Skill 是一个可自包含的文件夹，智能体可以按需加载。它只是一个 SKILL.md（YAML frontmatter + 指令），可选地附带参考文档、脚本和资源：

<skill-name>/
├── SKILL.md      ← 必需：何时使用 + 如何使用
├── README.md     ← 面向用户的文档
├── references/   ← 可选：智能体按需加载的扩展文档
├── scripts/      ← 可选：确定性可执行辅助脚本
└── assets/       ← 可选：模板、字体、图标

智能体根据 frontmatter 中的 description 行来决定是否激活该技能——因此 description 是你与智能体之间的契约。有关完整规范，参见 agentskills.io 和 Anthropic 的参考仓库。

欢迎提交 Bug 报告、新技能和工具改进。

维护者面向的文档——仓库布局、发布流程、版本规则、CI 工作流、故障排除——位于 CONTRIBUTING.md（中文）。如果你想添加技能或制作发布版本，请先阅读该文件。

git clone https://github.com/ConardLi/garden-skills.git
cd garden-skills
npm run list      # 显示所有技能 + 清单状态
npm run validate  # 与 CI 在每个 PR 上运行的检查相同

本集合站在以下项目的肩膀上：

Anthropic 提供 Agent Skills 规范和 anthropics/skills 参考仓库。

Claude Design——启发 web-design-engineer 的系统提示词。原始版本保存在 dist/prompt/claude-design-system-prompt.md 中供参照。

更广泛的 OSS 技能社区——参见 travisvn/awesome-claude-skills 和 obra/superpowers 以便进一步发现。