html-ppt-skill - 开源 AI PPT 生成 Skill，支持 HTML 文件

html-ppt-skill是什么

你有没有想过，PPT这事可以换个玩法？html-ppt-skill就是一个基于HTML的AI演示工具，它输出的文件格式很纯粹——浏览器原生支持的HTML文件。内置了36套主题、31种布局、47个动效和15套完整模板。Agent通过自然语言就能把这些组件组合成一份精致的演示文稿。更关键的是，它遵循AgentSkill协议，可以一键安装并在Claude Code、OpenClaw、Hermes Agent、Cursor/Codex等多个平台上通用。

html-ppt-skill的主要功能

既然说到了功能，那就展开聊聊它到底能干什么。直接看一组数据可能更直观：

• 36套主题
  ：从极简学术到赛博朋克，再到小红书柔和风，基本覆盖了主流的视觉风格。演示时按T键就能实时切换，这招在临时换方案时特别好用。

• 31种布局
  ：封面、目录、代码展示、时间线、架构图、流程图……每种布局都附带了真实的示例数据，省去了你从零填充的麻烦。

• 47个动效
  ：其中27个是CSS动画，另外20个是Canvas FX——粒子爆发、神经网络脉冲这类电影级效果，传统PPT很难做到这个程度。

• 15套完整模板
  ：这些模板提炼自真实项目，比如tech-sharing、pitch-deck、xhs-post、presenter-mode-reveal等等，拿来即用。

• 演讲者模式
  ：按S键弹出独立窗口，里面包含了当前页和下一页的预览、逐字稿、计时器。通过iframe加BroadcastChannel实现像素级精确同步，投屏时再也不用担心字体、间距、颜色对不上了。

• 跨平台Skill
  ：遵循AgentSkill协议，一行命令完成安装，Claude Code、OpenClaw、Hermes、Cursor/Codex都能调用。

如何使用html-ppt-skill

使用流程其实非常简单，大致分几步走：

• 安装Skill
  ：在终端执行 npx skills add https://github.com/lewislulu/html-ppt-skill，把这个Skill添加到你的Agent里。

• 自然语言触发
  ：直接在Agent中输入需求，比如“做一份10页微服务架构分享，暗色主题，含架构图和代码示例”。接下来就看Agent发挥了。

• 浏览器打开
  ：Agent会生成一个完整的HTML文件，双击就能查看，键盘翻页，不需要任何额外软件。

• 实时切换主题
  ：演示过程中按T键，就能在36套主题之间快速切换，找到最合适的那个。

• 开启演讲者模式
  ：按S键弹出独立演讲者窗口，预览、逐字稿、计时器一应俱全。

• 手动创建（可选）
  ：如果你喜欢命令行操作，也可以直接git clone仓库，然后运行./scripts/new-deck.sh my-talk生成基础结构。

html-ppt-skill的核心优势

那么，它凭什么能让人眼前一亮？核心优势其实很清晰：

• HTML替代PPTX
  ：纯文本格式，LLM天然擅长生成。零依赖、双击即开，彻底规避了PPTX排版错位和字体丢失的尴尬。

• 预制组件加AI组合
  ：人负责提供约束良好的主题、布局、动效等预制件，AI负责组合。这个思路很聪明——避免了从零创造带来的审美失控问题。

• 像素级演讲者同步
  ：预览与观众画面共用同一份HTML加CSS，彻底消除投屏时字体、间距、颜色不一致的“社死”瞬间。

• 一次安装，处处可用
  ：遵循agentskills.io开放标准，不绑定单一平台。这意味着你的能力资产可以跨Agent框架迁移。

• 电影级视觉效果
  ：手写Canvas模块实现了粒子、星空、神经网络等特效，表现力远超传统PPT动画。

html-ppt-skill的项目地址

• GitHub仓库
  ：https://github.com/lewislulu/html-ppt-skill

html-ppt-skill的同类竞品对比

既然要选工具，对比是少不了的。这里拿它和市场上另一个同类项目做了个横向对比：

lewislulu歸藏 (op7418) 3600+ (20天)16,000+ 单文件HTML单文件HTML 36套主题（极简/赛博/小红书等）2套风格：A电子杂志×电子墨水、B瑞士国际主义 31种通用布局A风格10种 + B风格22种锁定版式 47个（27 CSS + 20 Canvas FX电影级特效）WebGL背景 + 低性能静态模式（B键切换） 独立窗口，iframe + BroadcastChannel像素级同步，含逐字稿未明确内置演讲者模式 Agent从101个Skill中组合，约束“不发明新布局”7问清单前置对齐 → 大纲确认 → 选骨架填内容 基础图片插入支持生成纪实照片、信息图、流程图、系统关系图 15套完整deck模板（含xhs-post竖版）公众号21:9头图、1:1分享卡、小红书3:4、视频号横版 依赖SKILL.md规则约束checklist.md自检 + 校验脚本拦截居中标题、图片脱槽等

对比维度	html-ppt-skill	guizang-ppt-skill

html-ppt-skill的应用场景

最后说说它具体能用在哪里。从实际项目来看，这几个场景最为典型：

• 技术分享与开发者演示
  ：调用tech-sharing模板，配合tokyo-night、terminal-green等暗色主题，快速生成含架构图和代码示例的幻灯片，技术大会或者组内分享都很合适。

• 融资路演与产品Pitch
  ：用pitch-deck-vc模板，一键产出YC风格的商业计划书，数据图表和团队介绍布局都帮你安排好了。

• 小红书与社交媒体图文
  ：通过xhs-post模板生成3:4竖版内容，配合soft-pastel、xiaohongshu-white主题，直接适配社交平台比例，省去二次调整的麻烦。

• 学术汇报与论文展示
  ：采用minimal-white、editorial-serif、academic-paper等主题，风格严谨克制，期刊答辩和学术会议都能镇住场子。

• 企业商务与新闻播报
  ：corporate-clean、news-broadcast主题满足经营分析、销售复盘、项目月报等正式汇报场景，商务气质拿捏得刚好。