guizang-ppt-skill官网github下载,歸藏用于生成精美HTML幻灯片的AI代理技能
guizang-ppt-skill简介
Guizang PPT Skill 是由歸藏(@op7418)开源的一款”为 AI Agent 而生“的 HTML PPT 生成工具包,登顶 GitHub Trending Python 类目榜首,累计 22.4k stars + 1.6k forks,被 360 安全龙虾 / Kimi work / Cola Skill 金牌赞助并获真格 Token Grant。它不是一个 web app,而是一套结构化 Skill 工作流——配合 Claude Code / Codex / Cursor 等 AI Agent 使用,让 Agent 能直接生成单文件 HTML 横向翻页 PPT(双击浏览器打开即可演示,无需构建、无需服务器)。核心创新是两套视觉系统:
- Style A 电子杂志风(10 种版式 + 5 套主题色):像 Monocle 杂志贴上代码,适合叙事、分享、个人风格表达;
- Style B 瑞士国际主义(22 种锁定版式 + 4 套高饱和锚点色):网格至上、直角、发丝线、极致字号对比,适合事实、产品、方法论表达。配套 9 套主题色(不允许自定义 hex,保护美学)、9 份 references 参考文档、自动校验脚本(
validate-swiss-deck.mjs)、GPT-Image 2.0 配图能力,以及公众号 21:9 / 1:1 / 小红书 3:4 / 视频号 16:9 多平台封面生成。已上架 360 安全龙虾、Cola Skill、Kimi work 等平台 Skill 商店,可直接在 Claude Code / Codex 等 Agent 环境中调用。
guizang-ppt-skill github项目地址: https://github.com/op7418/guizang-ppt-skill
guizang-ppt-skill下载地址:链接:https://pan.quark.cn/s/bbeef30657f2

Guizang PPT Skill 体验:22.4k Stars 的开源 HTML PPT 生成器,让 AI Agent 一次做出杂志风 / 瑞士风演讲稿
一、当 AI 工具遇上”做 PPT”这个老大难
过去两年,AI 工具对”演示文稿”这件事的冲击几乎是所有产品里最弱的。原因不复杂——PPT 不只是”文本生成”,它有版式、节奏、视觉、留白、图片比例、字号对比等一整套设计语言的约束。让 AI 写出 “10 页演讲稿”很容易,但让它交付一份”能直接拿去线下分享”的 PPT,几乎是不可能的。
歸藏(@op7418)的 想解决的就是这个问题——它不是又一款”AI 生成 PPT”的 web app,而是一个为 Claude Code / Codex 等 Agent 环境量身定制的 Skill(即一套结构化工作流 + 模板 + 校验器的打包工具),让 Agent 能直接生成单文件 HTML 横向翻页 PPT,并通过两套视觉系统(Style A 电子杂志风 / Style B 瑞士国际主义)保证设计品质。
它登顶 GitHub Trending Python 类目榜首、累计 22.4k stars + 1.6k forks,被 360 安全龙虾、Kimi work、Cola Skill 金牌赞助并获得真格 Token Grant。这篇文章带你拆透这个项目:它做了什么、怎么用、和同类工具有什么本质不同。

二、Guizang PPT Skill 是什么?
2.1 一句话定义
一个让 AI Agent(Claude Code / Codex)按 8 步工作流生成单文件 HTML 横向翻页 PPT 的 Skill 工具包——自带两套视觉系统、22+10 套版式、9 套主题色、Playwright 后验检查器。
它和”AI 写 PPT 内容”最大的区别是:
- 不交付 PPTX 文件:最终交付是 单 HTML 文件(双击浏览器打开即可演示);
- 不依赖 SaaS 服务:模板、校验器、参考文档全部开源;
- 不只写内容,还管设计:通过 Style A/B 两套风格系统 + 版式锁定校验 把”设计感”工程化。
2.2 项目结构(一图看懂)
guizang-ppt-skill/
├── SKILL.md ← 工作流主文档
├── README.md / README.en.md ← 中英文 README
├── assets/
│ ├── template.html ← Style A 电子杂志风模板
│ ├── template-swiss.html ← Style B 瑞士国际主义模板
│ └── screenshot-backgrounds/ ← 截图美化背景(WebP)
├── scripts/
│ └── validate-swiss-deck.mjs ← 瑞士风版式校验器
└── references/
├── components.md ← 组件手册
├── layouts.md / layouts-swiss.md ← 32 种版式骨架
├── swiss-layout-lock.md ← 瑞士风硬约束
├── themes.md / themes-swiss.md ← 9 套主题色
├── image-prompts.md ← GPT-Image 2.0 配图指南
├── screenshot-framing.md ← CleanShot X 式截图适配
└── checklist.md ← P0/P1/P2/P3 质量检查
2.3 核心能力速查
| 维度 | 能力 |
|---|---|
| 视觉系统 | 双套:Style A 电子杂志 × 电子墨水 + Style B 瑞士国际主义 |
| 翻页交互 | 键盘 ← → / 滚轮 / 触屏滑动 / 底部圆点导航 / ESC 索引 |
| Style A 版式 | 10 种(封面、章节、数据大字报、图文、图片网格、Pipeline、对比等) |
| Style B 版式 | 22 种锁定版式(Cover、Statement、KPI Tower、Loop Diagram、Duo Compare、Image Hero、Closing Manifesto 等) |
| 主题色预设 | Style A 5 套 + Style B 4 套,不允许自定义 hex(保护美学) |
| 配图能力 | Codex 中可用 GPT-Image 2.0 / GPT-M 2.0 生成纪实照片、信息图、流程图、UI 情景图 |
| 多平台封面 | 公众号 21:9 / 公众号分享卡 1:1 / 小红书 3:4 / 视频号 16:9 |
| 低性能静态模式 | 按 B 关闭 WebGL/canvas 动画,PPT 退回静态背景 |
| 交付形态 | 单文件 HTML,无需构建、无需服务器 |
| 校验能力 | node scripts/validate-swiss-deck.mjs 自动校验 + 可选 Playwright 后验 |

三、Style A 电子杂志风 vs Style B 瑞士国际主义
Guizang 的核心创新是提供两套截然不同的视觉语言——这让 Agent 能根据内容性质选择最合适的设计,而不是”一种风格包打天下”。
3.1 Style A:电子杂志 × 电子墨水
气质定位:像 Monocle 杂志贴上了代码——叙事、观点、分享、个人风格表达。
5 套主题色:
| 主题 | 核心色 | 适合场景 |
|---|---|---|
| 🖋 墨水经典 | #0a0a0b / #f1efea | 通用默认、商业发布、不知道选啥时最稳 |
| 🌊 靛蓝瓷 | #0a1f3d / #f1f3f5 | 科技、研究、AI、技术发布会 |
| 🌿 森林墨 | #1a2e1f / #f5f1e8 | 自然、可持续、文化、非虚构内容 |
| 🍂 牛皮纸 | #2a1e13 / #eedfc7 | 怀旧、人文、阅读、历史、文学分享 |
| 🌙 沙丘 | #1f1a14 / #f0e6d2 | 艺术、设计、创意、时尚、画廊感内容 |
10 种版式:封面、章节、数据大字报、图文、图片网格、Pipeline、对比等。
3.2 Style B:瑞士国际主义
气质定位:网格至上、单一高饱和锚点色、直角、发丝线、极致字号对比——事实、产品、分析、方法论表达。
4 套主题色:
| 主题 | 锚点色 | 适合场景 |
|---|---|---|
| 🔵 克莱因蓝 IKB | #002FA7 | 通用默认、商业发布、AI 产品、方法论 |
| 🟡 柠檬黄 | #FFD500 | 年轻、运动、零售、消费品、Y2K 复古 |
| 🟢 柠檬绿 | #C5E803 | 生态、可持续、健康、Z 世代品牌 |
| 🟠 安全橙 | #FF6B35 | 警示、新闻、工业、运动、活力主题 |
22 种锁定版式(核心差异):所有正文页只能从 S01 到 S22 中选择,不能临时发明页面结构——这是保证”瑞士风”还原度的硬约束。
3.3 两套风格的对比
| 维度 | Style A 电子杂志 | Style B 瑞士国际主义 |
|---|---|---|
| 核心气质 | 叙事、表达、个人风格 | 事实、结构、方法论 |
| 版式自由度 | 10 种,可灵活组合 | 22 种锁定,禁止临时发明 |
| 字体哲学 | 多字体对比 + 字号层级 | 字号极端对比 + 网格主导 |
| 配图原则 | 图片作为叙事元素 | 图片必须进入 data-image-slot 槽位 |
| 适合场景 | 线下分享 / 个人演讲 / demo day | 产品发布 / 数据分析 / 行业报告 |
| 校验强度 | 中(参照 checklist.md) | 强(有自动校验器脚本) |

四、3 种安装方法(30 秒上手)
4.1 方式一:一行命令安装(推荐)
npx skills add https://github.com/op7418/guizang-ppt-skill --skill guizang-ppt-skill
4.2 方式二:直接发给 AI 助手
把下面这段话直接发给 Claude Code / Cursor / 任何有 shell 权限的 AI Agent,它会自动完成安装:
帮我安装
guizang-ppt-skill这个 Claude Code skill。请按下面步骤做:
- 确保
~/.claude/skills/目录存在(不存在就创建)- 执行
git clone https://github.com/op7418/guizang-ppt-skill.git ~/.claude/skills/guizang-ppt-skill- 验证:
ls ~/.claude/skills/guizang-ppt-skill/应该看到SKILL.md、assets/、references/三项- 告诉我安装好了,之后我说”做一份杂志风 PPT”之类的话就会触发这个 skill
4.3 方式三:手动命令行
git clone https://github.com/op7418/guizang-ppt-skill.git ~/.claude/skills/guizang-ppt-skill
4.4 装好之后这样用
直接在 Claude Code / Codex 里说:
帮我基于这篇文章做一份瑞士风 PPT,控制在 7 页左右,需要 2-3 张配图。
或者:
帮我把这份 Markdown 做成杂志风演讲 PPT。
基于这份 PPT 的核心观点,生成一张公众号 21:9 头图。
把这张产品截图重新设计成适合 PPT 的 16:10 配图。
4.5 触发关键词
| 类型 | 关键词 |
|---|---|
| 杂志风 | “帮我做一份杂志风 PPT”、”editorial magazine style presentation”、”electronic ink 风格演讲 slides” |
| 瑞士风 | “帮我做一份瑞士风 PPT”、”生成一个 horizontal swipe deck” |
| 封面生成 | “基于这篇文章做一张公众号 21:9 封面”、”基于这份 PPT 生成一张 1:1 分享卡” |

五、8 步完整工作流(Skill 工作机制)
装好之后,Agent 会按下面 8 步流程一步步引导你:
| 步骤 | 动作 | 关键工具 |
|---|---|---|
| 1 | 选择风格 | Style A 电子杂志风 或 Style B 瑞士国际主义 |
| 2 | 需求澄清 | 7 问清单:风格、受众、时长、素材、图片需求、主题色、硬约束 |
| 3 | 拷贝模板 | Style A 用 assets/template.html,Style B 用 assets/template-swiss.html |
| 4 | 填充内容 | 先做主题节奏表,再从版式骨架里挑、粘、改文案 |
| 5 | 可选配图 | 在 Codex 中询问是否用 GPT-Image 2.0 / GPT-M 2.0 生成配图 |
| 6 | 自检 | 对照 references/checklist.md,P0 级问题必须全过;瑞士风还要运行版式校验器 |
| 7 | 预览 | 浏览器直接打开 |
| 8 | 迭代 | inline style 改字号/高度/间距 |
5.1 瑞士风的额外校验
node scripts/validate-swiss-deck.mjs path/to/index.html
校验器会拦截:
- ❌ 居中标题(瑞士风禁止)
- ❌ 实验性版式(只能从 S01-S22 选)
- ❌ SVG 内写字
- ❌ 图片脱离槽位
- ❌ 中文字号过大(中文大标题需降一档)
- ❌ 图文底不对齐
如果用 Playwright,还能量化:渲染后的 overflow、bottom whitespace、title gap。

六、5 大典型使用场景(附推荐方式)
| 场景 | 推荐方式 |
|---|---|
| 长文章变演讲 PPT | 先抽核心观点,再按 6-10 页节奏生成 deck |
| 方法论 / 产品分析 | 用 Style B 瑞士风,优先使用锁定版式和 21:9 主图 |
| 个人分享 / 观点表达 | 用 Style A 电子杂志风,保留更强叙事感 |
| PPT 配图 | 在 Codex 中用 GPT-Image 2.0 / GPT-M 2.0 生成照片、信息图、流程图、UI 情景图 |
| 多平台封面 | 从同一份内容生成公众号 21:9、1:1 分享卡、小红书 3:4、视频号横版封面 |
| 截图统一风格 | 把原始截图重新生成到模板需要的比例,再插入 PPT |
6.1 配图的 4 条关键规则
如果你让 Codex 自动生成配图,必须遵守:
- 图片是嵌入素材,不要自带页脚、页底、标题、角标、页码或装饰边框
- 图片语言跟随 deck 语言(中文 deck 用中文标签,英文 deck 用英文标签)
- 图片比例必须先匹配落位:瑞士风主图常用 21:9,通用主图常用 16:9 / 16:10,截图再设计常用 16:10
- 截图保真:先读
references/screenshot-framing.md,用assets/screenshot-backgrounds/内置背景 + 程序化缩放处理,不要默认重画
6.2 4 种封面规格
| 平台 | 比例 | 特点 |
|---|---|---|
| 公众号头图 | 21:9 | 主标题优先,右侧或边缘保留视觉锚点 |
| 公众号分享卡 | 1:1 | 与头图共用主题色、关键词和视觉元素 |
| 小红书封面 / 轮播 | 3:4 | 大标题优先,多张时统一字号和视觉节奏 |
| 视频号 / 横版封面 | 16:9 | 标题 + 副标题 + 单一视觉焦点 |
七、8 条核心设计原则(这是项目的”灵魂”)
我整理了 README 与 SKILL.md 里反复强调的 8 条原则,这是项目作者反复打磨的设计哲学:
| # | 原则 | 含义 |
|---|---|---|
| 1 | 克制优于炫技 | WebGL 背景只在 hero 页透出,其它页面保持静态 |
| 2 | 结构优于装饰 | 信息靠字号 + 字体对比 + 网格留白,不用阴影和浮动卡片 |
| 3 | 图片是第一公民 | 图片要对齐正文内容区,比例稳定,只裁底部,顶部和左右完整 |
| 4 | 配图只做素材 | 生成图只保留核心照片/图表/UI,不要把 PPT 页脚、标题画进图片里 |
| 5 | 节奏靠 hero 页 | hero / non-hero 交替,才不累眼睛 |
| 6 | 低性能可退场 | 按 B 能切换到静态模式,动态效果不能成为阅读负担 |
| 7 | 术语统一 | Skills 就是 Skills,不中英混译 |
| 8 | 瑞士风必须守版式 | Style B 优先还原原始 22P 版式,不要为了”多样”发明不存在的页面 |
这 8 条原则和项目的 visual reference 一脉相承:Monocle 杂志的版式 / YC Garry Tan “Thin Harness, Fat Skills” / Massimo Vignelli / 瑞士国际主义网格系统。
八、平台支持矩阵
| 平台 | 状态 | 说明 |
|---|---|---|
| Claude Code | ✅ 支持 | 原生 Skill 工作流,最适合生成和迭代 HTML deck |
| Codex | ✅ 支持 | 适合生成 PPT、调用图片生成能力、做浏览器视觉检查 |
| Cursor / 其他本地 Agent | ⚠️ 可用 | 需要能读写文件并执行 shell 命令 |
| WorkBuddy | 🚧 适配中 | 单独整理上架版本,去掉平台不需要的渠道差异 |
| 普通 Chatbot | ❌ 不推荐 | 没有文件系统和浏览器预览时,很难稳定生成完整 deck |
| 360 安全龙虾 / Cola Skill / Kimi work | ✅ 已上架 | 在 Skill 商店搜索 “guizang ppt skill” 即可使用 |
九、与其他 AI PPT 工具的本质区别
我整理了一个横向对比表,让你看清 guizang-ppt-skill 在 AI PPT 赛道的定位:
| 维度 | Guizang PPT Skill | Gamma.app | Beautiful.ai | ChatGPT + PPT | 国产 AI PPT |
|---|---|---|---|---|---|
| 交付物 | 单文件 HTML | SaaS 网页 | SaaS 网页 | PPTX | PPTX |
| AI 集成 | Skill(Claude Code / Codex) | Web 端 | Web 端 | 对话式 | Web 端 |
| 设计自由度 | 高(22+10 版式) | 中(模板多) | 中 | 高(但难控制) | 中 |
| 设计品质 | ★★★★★(Magazine / Swiss) | ★★★ | ★★★★ | ★★ | ★★★ |
| 可修改性 | 改 HTML 源码 | 改 SaaS | 改 SaaS | 改 PPTX | 改 PPTX |
| 离线使用 | ✅ 完全本地 | ❌ 需联网 | ❌ 需联网 | ⚠️ 部分 | ❌ 需联网 |
| 开源 / 可定制 | ✅ AGPL-3.0 | ❌ | ❌ | ❌ | ❌ |
| GitHub Stars | 22.4k | – | – | – | – |
| 适合场景 | 线下分享、演讲、产品发布 | 营销 PPT、内部汇报 | 商务汇报、报告 | 通用 | 通用 |
| 配图能力 | Codex GPT-Image 2.0 | 内置 | 内置 | DALL-E | 内置 |
一句话差异:Guizang PPT Skill 是唯一一个”为 AI Agent 设计、交付开源 HTML、提供设计哲学护栏”的 PPT 生成方案。它不是又一个 SaaS,而是把”做 PPT”这件事工程化、可复现化的工具包。
十、适合谁用?适合什么场景?
✅ 最佳用户
| 用户 | 使用场景 |
|---|---|
| 独立开发者 / 设计师 | 自己做产品发布、技术分享、demo day |
| AI 产品经理 / 创业者 | 做产品发布演讲、demo day、媒体沟通 |
| 研究者 / 学界 | 学术报告、方法论分享、读书会 |
| 行业 KOL / 自媒体 | 个人分享、观点输出、平台封面 |
| 品牌/咨询/营销人 | 私享会、行业内部讲话、客户提案 |
❌ 不适合
- 大段表格数据展示:HTML 排版天然不适合信息密度超高的培训课件;
- 多人协作编辑:单文件 HTML 没有版本合并 / 多人同时编辑能力;
- 需要 PPTX 格式:如果你必须输出 .pptx 用 KeyNote / PowerPoint 打开,建议转用传统 SaaS;
- 新手第一次做 PPT:Skill 是给 AI Agent 用的工作流,需要懂 Claude Code / Codex 才能用。
十一、Roadmap:项目接下来会做什么
作者在 README 中明确列出了后续方向:
- 补充更多真实案例和可打开的 HTML deck 示例
- 扩展封面规格,覆盖更多内容平台(B 站、抖音、即刻等)
- 增加更多瑞士风版式校验规则
- 优化截图再设计和信息图生成工作流
- 整理 WorkBuddy 等平台上架版本
- 增加更多主题包,但继续限制自定义颜色
可以看出作者对项目有清晰的方向感——不会为了”看起来很丰富”而牺牲美学护栏。
十二、常见问题 FAQ
Q1:可以导出 PPTX 吗?
A:当前核心交付是 HTML。你可以用浏览器演示、截图或录屏。如果需要 PPTX,建议把 HTML 页面作为视觉稿再转换,但这不是当前主流程。
Q2:为什么不允许自定义颜色?
A:这个 Skill 的重点是稳定产出。自由选色很容易破坏整体风格,所以只允许从预设主题里选——这是”保护美学比给自由更重要”的设计哲学。
Q3:可以加自己的版式吗?
A:
- Style A:可以在
references/layouts.md里扩展(设计自由度更高); - Style B:更严格,需要同步更新
template-swiss.html、layouts-swiss.md、swiss-layout-lock.md和校验器脚本。
Q4:Codex 配图是必须的吗?
A:不是。没有配图也能生成 PPT。配图流程只在需要照片、信息图、UI 情景图或封面时使用。
Q5:怎么更新到最新版?
A:
# 方法一:重新安装
npx skills add https://github.com/op7418/guizang-ppt-skill --skill guizang-ppt-skill --force
# 方法二:在 skill 目录执行 git pull
cd ~/.claude/skills/guizang-ppt-skill && git pull
Q6:生成的 PPT 能在手机上演示吗?
A:可以。模板本身就是响应式的,键盘 / 滚轮 / 触屏滑动都支持。Style B 还有低性能静态模式(按 B 切换),适合在性能弱的设备上演示。
Q7:可以自定义字体吗?
A:Style A 允许一定程度的字体扩展;Style B 严格不允许——字体是瑞士风的核心美学元素之一。
Q8:与 Office PPT 相比,HTML PPT 有什么优势?
A:
| 维度 | HTML PPT | Office PPT |
|---|---|---|
| 交付形态 | 单文件 HTML | PPTX |
| 跨平台 | ✅ 浏览器即可 | ⚠️ 需要 Office |
| 体积 | 极小(KB 级) | 大(MB 级) |
| 动画 | WebGL / CSS / JS | 内置动画引擎 |
| 修改 | 直接改源码 | 需要打开软件 |
| 协作 | ❌ | ✅ |
| 兼容性 | ✅ 任何浏览器 | ⚠️ 排版可能错乱 |
十三、我的评价:为什么这个项目值得 22.4k Stars?
项目作者歸藏(@op7418)的核心洞察是:
大多数 AI 工具擅长”内容生成”,但对”设计语言的护栏”无能为力——这是 PPT 这个领域一直做不好的根因。
guizang-ppt-skill 的解法非常工程化:
- 双视觉系统 + 9 套主题色:把”美学”封装成可枚举的预设,避免 Agent 自由发挥破坏设计;
- 32 种版式骨架 + 锁定校验:把”页面结构”工程化,瑞士风尤其严格(22 种锁定版式 + 自动校验器);
- 8 条核心设计原则:让 Agent 在生成时遵守”克制优于炫技、结构优于装饰、图片是第一公民”等约束;
- 单文件 HTML 交付:无需 SaaS、无需构建、无需服务器,最轻量的演示形态;
- 为 Agent 而生:所有模板、参考文档、校验脚本都是结构化文本,Agent 能直接读、改、验证。
这种“工程化美学”的做法,让这个项目从 2025 年发布以来迅速积累 22.4k Stars + 1.6k Forks,被 360 安全龙虾、Kimi work、Cola Skill 金牌赞助——它的火爆说明 AI 创作者社区对”高质量演示内容”的需求是真实且巨大的。
十四、结语:让 AI Agent 真正能”做 PPT”
回到一开始的命题:当 AI Agent 学会做 PPT,它会是什么样?
guizang-ppt-skill 给出的答案是:
- 不是”AI 帮你写文案 + 你自己排版”;
- 不是”AI 生成一堆 PPTX 文件让你下载”;
- 而是”AI Agent 在 22 种瑞士风版式 / 10 种杂志风版式中选一种,按 8 步工作流生成一份带配图、带封面、带校验的单文件 HTML PPT”。
它不是在做一个”AI 工具”,而是在做 “AI 时代的演示内容生产线”——把演示内容的生产从”设计师手工 → AI 写文案 + 设计师调样式”压缩到”AI Agent 端到端完成”。
如果你是 Claude Code / Codex 的高频用户,强烈建议你花 30 秒装上这个 skill——下一个你需要在公司/社群做分享的场合,它会帮你省下至少 3 小时的 PPT 制作时间。
关键信息汇总
| 项目 | 内容 |
|---|---|
| 项目地址 | https://github.com/op7418/guizang-ppt-skill |
| 作者 | 歸藏(X: @op7418) |
| License | AGPL-3.0 |
| Stars | 22.4k |
| Forks | 1.6k |
| Commits | 26 |
| 核心能力 | 双视觉系统 + 32 版式 + 9 主题色 + 校验器 + GPT-Image 2.0 配图 |
| 支持平台 | Claude Code / Codex / Cursor / 360 安全龙虾 / Cola Skill / Kimi work |
| 交付形态 | 单文件 HTML(无需构建、无需服务器) |
| 赞助商 | 360 安全龙虾 / Kimi work / Cola Skill / 真格 Token Grant |
| 安装命令 | npx skills add https://github.com/op7418/guizang-ppt-skill --skill guizang-ppt-skill |
| 适合人群 | 独立开发者、AI 产品经理、研究者、KOL、品牌咨询 |
| 不适合 | 大段表格数据 / 多人协作 / 必须 PPTX 格式的场景 |
最后:如果你想真正用起来,最快的方法是直接装好 skill,然后找一篇你最近写的文章,对 Agent 说”帮我做一份瑞士风 PPT,7 页左右”——30 分钟内你就能感受到”AI 端到端做 PPT”是什么体验了。
相关导航
没有相关内容!
暂无评论...


