影像叙事演示
+7- 免费幻灯片137137 次安装1+7
- Claude Code
Codex
Cursor
HTML 演示文稿风格
筛选标签：全部 · 路演与商务 · 研究与教学 · 品牌与创意
为什么选 HTML 幻灯片
真正的 HTML，而不是截图
任何尺寸都清晰，Agent 也方便编辑。
在 deck studio 中编辑
点击即可改写、移动和调整顺序。
导出为 PowerPoint
需要文件时，导出可编辑的 PPTX。
HTML 演示文稿 vs PPT 文件
| Aspect | HTML 演示文稿 | PPTX 文件 |
|---|---|---|
| 打开方式 | 任意浏览器 | PowerPoint、Keynote |
| 可由 Agent 直接编辑 | 是 | 否 |
| 完整 CSS 动效与网页字体 | 是 | 否 |
| 以链接分享 | 是 | 否 |
如何用 AI Agent 制作 HTML 幻灯片
从选风格到演示，只需三步。
第 1 步选择 HTML 幻灯片风格
选择 PPT 风格，安装前先预览真实幻灯片。
选择适合演讲的风格：以图表为主的研究型 PPT、适合发布会的大胆杂志风 PPT，或适合客户汇报的沉稳咨询式叙事。每个 Skill 页面都展示了真实幻灯片，安装前就能看到效果。
浏览幻灯片 Skills
第 2 步安装 Skill 并描述演讲内容
把安装提示词粘贴给 Claude Code 或 Codex，然后给出主题、受众和页数。
Read https://skillry.dev/skills/<slug>/install.md and follow the instructions to install the skill.在 Claude Code、Codex 或其他 Agent 中安装 Skill，然后给出主题、受众、页数和要参考的文件。Agent 会按所选风格把演示文稿写成 HTML。
第 3 步播放 HTML 幻灯片或导出为 PPTX
在浏览器中全屏演示，或导出可编辑的 PPTX。
打开 deck studio 改写文字、移动模块、调整幻灯片顺序。在浏览器中全屏演示，或在有人需要 PowerPoint 文件时导出可编辑的 PPTX。相关内容
Codex Skills
什么是 HTML 幻灯片？
HTML 演示文稿 vs PowerPoint 文件
HTML 演示文稿是一组网页，每次显示一张幻灯片。它能在任何浏览器中打开，在任何屏幕上都清晰缩放，并支持网页字体、CSS 布局和动效。由于幻灯片就是代码，AI Agent 可以像编辑其他文件一样轻松地编写、改风格和更新它们，所以 HTML 幻灯片比二进制的 PowerPoint 文件更适合由 Agent 制作。
HTML 转 PPTX：导出你的幻灯片
你不必二选一。当你能掌控放映屏幕时，直接在浏览器中播放 HTML 版本；当客户、大会或同事需要 PowerPoint 文件时，从 deck studio 导出可编辑的 PPTX。
HTML 幻灯片框架 vs AI Skills
Slidev、reveal.js 和 Marp 是流行的开源工具，用代码写幻灯片。Slidev 用 Vue 组件把 Markdown 变成幻灯片，并提供对开发者友好的编辑器；reveal.js 是一个 HTML 演示框架，用 HTML、CSS 和 JavaScript 构建；Marp 把纯 Markdown 转成幻灯片，并可导出 PDF、PPTX 和 HTML。它们给你完全的控制权，但每张幻灯片仍需你亲自设计。HTML 幻灯片 Skill 更高一层：Agent 根据需求用成品设计写出整套演示文稿，你在 deck studio 中编辑并导出可编辑的 PPTX。想亲手打造一场演讲就用框架；想快速得到设计好的演示文稿就用 Skill。
| 工具 | 是什么 | 许可证 |
|---|---|---|
| Slidev | Markdown + Vue 幻灯片框架 | MIT |
| reveal.js | HTML 演示框架 | MIT |
| Marp | Markdown 幻灯片生态 | MIT |
| HTML 幻灯片 Skill | 由 Agent 编写的设计型演示文稿，支持 PPTX 导出 | Skillry 许可 |
HTML 幻灯片常见问题
什么是 HTML 幻灯片？
HTML 幻灯片是以网页形式构建的演示文稿。每张幻灯片用 HTML 和 CSS 排版，并在浏览器中全屏显示，因此可以使用网页字体、响应式布局和 CSS 动效。由于它们是普通文件，AI Agent 可以直接编写和编辑。
HTML 幻灯片能转成 PPT 吗？
能。Skillry 幻灯片 Skills 自带 deck studio，可导出可编辑的 PPTX，用 PowerPoint 演示的同事可以继续编辑演示文稿。文字保持可编辑，图片保持为独立对象。
HTML 演示文稿可以离线使用吗？
演示文稿文件放进项目后，你可以在没有网络的情况下用浏览器在本地打开。如果某个风格从 CDN 加载网页字体，请附上字体的本地副本，以便完全离线使用。
哪些 Agent 能制作 HTML 幻灯片？
Claude Code、Codex、Cursor、Antigravity、OpenCode、GitHub Copilot，以及任何能读取 SKILL.md 格式的 Agent。同一个 HTML 幻灯片 Skill 在每个 Agent 中都能做出相同的设计。
一份 HTML 演示文稿可以有多少页？
页数由你在需求中设定。无论你要多少页，Skill 都会保持封面、章节页、内容页和结尾页版式一致，之后还可以在 deck studio 中增删幻灯片。
HTML 幻灯片 Skills 需要图片 API 吗？
看具体 Skill。很多 PPT Skill 自带图库，默认复用库里的图片，你自己的照片和图表也始终优先，这种情况下不需要图片 API。如果想按主题重新生成配图，Skill 会用 Agent 自带的生图工具（比如 Codex 内置的 GPT Image）；在没有内置生图工具的 Agent 里，支持 fal 的 Skill 需要你自己的 FAL_KEY。需要 API Key 的 Skill 会在 Skill 页面上标出来。