一个提示词,8分钟出完整PPT:html-ppt-skill实测
- 2026-11-02 18:14:24
下午2点分享，PPT还没动
不是不会——是每次总有一半时间在调间距、换颜色、对齐文字。内容早想清楚了，消耗全在「让它看起来专业」这件事上。
这就是 html-ppt-skill 要解决的。
做PPT这件事，有了接口
html-ppt-skill 不是模板站，也不是 AI 画图工具。它是给 AI Agent 用的幻灯片生成系统：一句人话，输出完整 HTML 演示文稿。
36 套主题、31 种布局、47 种动画——这些是数字。真正有意义的变化是：做 PPT 这件事，被定义成了一个可以调用的接口。
第一次怎么开始
第一次用 html-ppt-skill，有两个地方必踩坑，先说清楚：
❌ 错：双击打开 index.html
直接双击打开，主题样式完全不生效，显示的是白底纯文本。
✅ 对：用本地服务器预览
python3 -m http.server 8080
然后浏览器访问 localhost:8080，主题样式正常显示。
改文字怎么改？
没有所见即所得界面。有两个方式：
方式一： 让 Claude Code 帮你改——说「把第3页标题改成XX」它直接改 HTML
方式二：熟悉 HTML 的话，直接打开文件找到对应 <section class="slide"> 块改文字
品牌色也能换
每个主题的颜色都定义在 CSS 变量里。在生成指令里加一句 override，就能把主题配色换成你自己的品牌色——背景、标题、强调色、辅助线、图标，想换哪个说哪个，不需要动任何主题文件。
三个场景实测
场景一：融资路演
提示词直接抄：
turn this outline into a pitch deck, professional style, include problem/solution/market/traction/team slides
跑出来的结果：背景问题 → 解决方案 → 数据验证 → 团队 → 融资计划，整套叙事节奏自动排好，关键数据页视觉权重自动加重。
选用 aurora 主题（黑底蓝绿渐变），科技感和专业感兼顾。
融资路演模板标准化程度高，AI 稳稳接住没问题。省掉排版，把精力放回叙事本身。
场景二：小红书图文
提示词直接抄：
做一个小红书图文，9张，竖版9:16，xiaohongshu-white风格，发布健身/生活类内容，中文
跑出来的结果：9图风格统一，移动端适配，导出后直接可发。
小红书用户要的是风格统一，不是设计精度。AI 产出版本基本不用改就能发，可用率最高的一个场景。
场景三：精读信息流卡片
提示词直接抄：
Create a single page deck using xhs-white-editorial template .
跑出来的结果：品牌色自动替换，标题、区块、结论色块一次生成，900×1600px 竖版，浏览器打开截图直接用。
模板结构固定，每次只换内容和品牌色。从文章写完到配图出炉，不超过 5 分钟。适合有固定品牌色、需要批量出文章配图的创作者。
四个坑，提前告诉你
坑1：自然语言改间距，执行结果不稳定
通过 Claude Code 用自然语言调整 CSS 间距，结果不稳定——有时只改了部分元素，有时完全没变化。要精确控制排版，需要自己打开 HTML 手动修改 margin/padding 数值。官方没有说明这个问题，属于实测发现。
坑2：只能导出 PNG，不支持 Keynote/PPTX
导出格式只有 PNG（通过 render.sh 调用 headless Chrome 渲染）。Keynote 和 PowerPoint 导出完全没有。如果交付场景需要可编辑的 PPT 文件，这个工具不适合你。浏览器直接演示或导出 PNG 发给对方，才是它的正确用法。
坑3：双击 HTML 文件打开，样式全丢
这条重复提醒，因为第一次用必踩。记住：必须用本地服务器预览，或用 render.sh 导出 PNG。
坑4：HTML 文件无法直接编辑内容
用浏览器打开生成的 HTML，显示的是渲染后的页面，点击无法编辑。要改文字必须用代码编辑器打开源码，找到对应的 <section> 块手动改。不熟悉 HTML 的用户，让 Claude Code 帮改是最省事的方式。
安装三步，国内网络稳过
第一步：离线包安装
在 GitHub Release 页面下载 zip 包，本地解压。不依赖 git clone，网络不稳也能装。
第二步：用 Claude Code 生成
把 SKILL.md 加载进 Claude Code，用自然语言描述你要的 deck，它直接生成 HTML 文件。
第三步：用 render.sh 导出 PNG
Mac/Linux 直接跑，Windows 需要 WSL 或 Git Bash。导出的 PNG 文件保存到指定文件夹，直接可用。
适合谁，不适合谁
✅ 推荐用：
设计师/博主：有图文发布需求，想省时间
融资阶段团队：路演材料要快速出稿，浏览器直接演示
技术博主/讲师：需要频繁做分享 slides，导出 PNG 直接用
❌ 不建议用：
需要交付可编辑 PPTX/Keynote 文件的场景
不熟悉 HTML、又不想用 Claude Code 辅助改内容的人
对视觉排版要求 100% 精确的场景（AI 出初稿，细节仍需人工收尾）
一句话
html-ppt-skill 证明了 PPT 这件事可以有接口。坑是真实存在的，但对于需要快速出稿的场景，这些坑完全值得踩一遍。
以后的问题不再是「怎么把它做漂亮」——是「你想表达什么」。
立即可用：github.com/lewislulu/html-ppt-skill
