garden-skills

Garden Skills

一个精选的、可直接用于生产的 Agent Skills（智能体技能）集合，适用于 Claude Code、Cursor、Codex 及其他 AI 编程智能体。

web-video-presentation 网页视频 / 演示文稿	web-design-engineer 设计 / 前端
gpt-image-2 图像生成 / 提示词工程	beautiful-article 任意来源 → 精美文章

English · 中文文档 · 日本語

---

目录

安装	使用	贡献
安装 skills CLI (npx) Claude Code 插件市场 固定版本的 .zip（通过 Releases） 手动复制 Git submodule	兼容性 什么是 Skill？	贡献 致谢 许可证

---

web-video-presentation

类别： 网页视频 / 演示文稿工程
最适合： 将脚本、文章、课程、产品演示和演讲转化为点击驱动的 16:9 网页演示文稿，并可通过屏幕录制生成具有电影感的视频。

web-video-presentation 构建可直接用于录制的 Vite + React + TypeScript 演示文稿，其行为方式如同视频制作平台。该工作流将原始文章转化为解说脚本，将脚本节拍映射到全屏场景，在需要检查点处暂停，并可在视觉大纲获批后选择性地合成解说音频。

亮点：

• 固定 1920×1080 舞台，可缩放以适应视口，确保屏幕录制稳定
• 点击 / 键盘驱动的 (chapter, step) 光标，每个视觉步骤对应一个解说节拍
• 针对脚本、主题、大纲、实现模式和可选音频设置硬性协作检查点
• 隐藏仅悬停可见的进度控制，确保录制时舞台保持干净
• 主题令牌体系，内置 23 套主题，每套都有独特的设计风格 —— 编辑风、终端风、工程风、瑞士国际主义风等
• 可插拔 TTS —— 与提供商无关的音频运行器；内置两个提供商（MiniMax mmx-cli + 通过 curl 调用 OpenAI TTS），另附 ElevenLabs / edge-tts / Azure / Google Cloud / macOS say 的契约和即贴即用代码片段
• 搭建完整的 Vite + React + TypeScript 项目，包含可复用的舞台原语和录制指南

creative-voltage 创意演讲

blueprint 技术架构

swiss-ikb 数据报告

chalk-garden 科普

↑ 全部 23 套主题一览 —— 打开完整画廊 查看实时 16:9 预览、设计风格和最佳适用场景。

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

---

web-design-engineer

类别： 设计 / 前端
最适合： 网页、落地页、仪表盘、交互原型、HTML 幻灯片、动效、UI 线框稿、数据可视化和设计系统探索。

web-design-engineer 将 AI 生成的网页产物从仅具备功能性提升为精致、考究且视觉上令人印象深刻的前端作品。它将智能体视为设计工程师：首先理解产品背景，然后声明设计系统，展示早期 v0 版本，构建完整体验，并验证最终结果。

亮点：

• 将需求简报转化为包含五个维度的设计审核（Design Read）：变化性、动效、密度、资源依赖度和品牌保真度
• 在改动现有产品前，区分扩展、保留和彻底改版三种设计模式
• 仅在用户明确要求验收、QA 或浏览器测试时才执行可运行的浏览器验收
• 通过反俗套黑名单和更强的视觉判断力，突破通用的 AI UI 模式
• 内置 设计方向顾问（六个差异化流派）+ 25 套锚定风格配方（Linear / Aesop / Pentagram / Bloomberg / Stripe Press / Mid-Century 等）—— 每套配方都包含具体的调色板、字体排印、标志性手法和反模式，可直接粘贴到设计系统声明中
• 覆盖 HTML / CSS / JavaScript / React 原型，并提供响应式布局、动效和交互打磨指南
• 包含关于内联 React + Babel、CSS tokens、oklch() 色彩工作流、容器查询和 reduced-motion 处理等实用实现规则
• 附带高级模式参考，涵盖设备框架、幻灯片引擎、动画时间线、仪表盘和其他可复用的网页产物

aesop 药妆页面	muji-kenya-hara 器物目录	monocle-magazine 杂志目录	stripe-press 书籍详情
bloomberg-terminal 交易仪表盘	linear 开发者工具落地页	vercel-mesh 部署 Hero 区	tufte-dataink 数据叙事
mid-century-modern 海报致敬	y2k-retrofuturism Y2K 门户	businessweek-turley 编辑封面	active-theory 电影感发布

↑ 25 套锚定配方中的 12 套 —— 打开完整画廊 查看全部 25 个可运行作品（药妆页面、交易工作台、杂志封面、Y2K 门户、世纪中期海报……），含标志性手法和最佳适用场景。

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

---

gpt-image-2

类别： 图像生成 / 提示词工程
最适合： 海报、UI 线框稿、产品视觉图、信息图、学术图表、技术示意图、漫画、头像、分镜脚本、品牌板以及图像编辑工作流。

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

亮点：

• 支持三种运行模式：模式 A Garden 本地、模式 B 宿主机原生委派和模式 C 仅顾问提示词撰写
• 每个任务都从模式检测开始，避免技能静默选择错误的执行路径
• 在 references/ 下提供 18 个视觉类别和 79 个结构化提示词模板
• 通过专门的工作流和脚本同时覆盖图像生成和图像编辑
• 在 Garden 模式下将提示词和生成的图像保存到 garden-gpt-image-2/ 目录，便于复用、审阅和版本管理

精选实战案例

background-replacement 人像编辑，时代广场重打光。	chat-interface-scene Claude 风格助手产品截图。	live-commerce-ui 名人直播带货界面。	product-card-overlay 护肤品类落地页 Hero 区。
bento-grid-infographic 高密度 iPhone 16 Pro 产品图解。	system-architecture 多租户 AI SaaS 生产架构图。	dense-explainer-slides 一页讲清 AI Agent 机制。	food-map 城市漫步编辑风美食指南。
exploded-view-poster Vision Pro 2 光学与算力拆解图。	neural-network-architecture ViT-B/16 模型论文配图。	cosmetic-packaging 高端护肤礼品盒构图。	anime-key-visual 游戏上线主视觉，安全构图适配裁切。

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

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

---

kb-retriever

类别： 检索 / 本地知识库
最适合： 从本地 knowledge/ 目录回答问题、搜索结构化文档，并从 Markdown、文本、PDF 和 Excel 文件中提取证据，且不会淹没智能体上下文。

kb-retriever 是一个围绕谨慎、渐进式搜索构建的本地知识库检索器。它不加载整个文件，而是导航分层索引文件、缩小候选集、正确处理复杂文件类型，并附带来源回答问题。

亮点：

• 在搜索内容之前，使用分层的 data_structure.md 文件导航知识库
• 对 PDF 和 Excel 文件强制执行先学习后处理规则，在提取或分析之前先使用附带的参考文档
• 结合精确关键词搜索、本地窗口读取、同义词和迭代优化
• 将检索限制为最多 5 轮搜索，确保探索过程可控
• 包含 grep、pdftotext、pdfplumber 和 pandas 的工作流，并带有来源感知的答案格式

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

---

beautiful-article

类别： 编辑 · 任意来源 → 精美文章
最适合： 将 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…）加上仅使用主题令牌的 Raw 自由层；底层 React 库位于 ConardLi/reacticle
• 10 种文章类型及附带的内容保留率 —— longform · ~100% / tutorial · ~90% / full-report · ~80% / explainer · ~80% / dialogue · ~80% / review · ~70% / essay · ~70% / briefing · ~50% / visual-essay · ~40% / interactive-explainer · ~25% 摘录 + 75% AI 重建
• 11 套写作主题配置文件（tufte、press、bayer、bodoni、vignelli、sottsass、freddie、andy、fuller、knuth、shannon）—— 每套都是给智能体的 Markdown 契约，而非 CSS 文件
• 硬性协作检查点，逐项记录决策（无静默默认值），外加 3:4 书本式封面、默认开启的目录和语言感知的翻译步骤
• 逐节点质量协议 —— 主智能体对计划进行内联检查，子智能体审阅者负责首页跨页 / 章节 / 最终审阅，以最小切片进行修复

主题画廊

tufte

press

<img src="https://cdn.jsdelivr.net/gh 开源项目ConardLi2026-08-26原文 打开互动版 相关内容 browser-use marin ponytail freellmapi