# HTML PPT 生成器
> 专业 HTML 演示文稿生成 Skill。一句话需求到完整幻灯片，36套精美主题、31种页面布局、47种动画效果（27 CSS + 20 Canvas），无需 PowerPoint。当用户说'帮我做PPT'、'生成演示文稿'、'做幻灯片'、'做汇报材料'时触发此 Skill。核心优势：纯 HTML 输出、可在浏览器直接展示、支持动画效果、样式专业精美。
- Skill: `gaoqiongxie/html-ppt` (Agent Skill)
- Install (CLI): `npx skillmds@latest add gaoqiongxie/html-ppt`
- Raw SKILL.md: https://api.skillmd.com/api/skills/gaoqiongxie/html-ppt/raw
- Safety review: pending
- Works with: Claude Code, Claude.ai, OpenAI Codex
- Category: Web & Frontend
- Author: gaoqiongxie (https://skillmd.com/u/gaoqiongxie)
- Updated: 2026-09-17
- Page: https://skillmd.com/skills/gaoqiongxie/html-ppt
---
> **来源**: lewislulu/html-ppt-skill ⭐1,754（GitHub本周热门新晋）
>
> **发布时间**: 2026-04-15
>
> **灵感来源**: "PPT 的未来是 HTML" —— 告别 PowerPoint，用纯 HTML 生成专业幻灯片
# HTML PPT 生成器 Skill
在 Agent 工作流中，一句话生成专业级 HTML 演示文稿。
---
## 🎨 核心能力
| 维度 | 数量 | 说明 |
|------|------|------|
| 主题 | **36套** | 商务、科技、极简、活泼、暗黑等风格 |
| 完整Deck模板 | **15套** | 开箱即用的整套演示模板 |
| 页面布局 | **31种** | 封面、目录、内容页、对比、数据等 |
| 动画效果 | **47种** | 27种CSS动画 + 20种Canvas特效 |
---
## 🚀 使用方式
### 基本用法
```
用户：帮我做一个"Q1业绩总结"PPT，5页，商务风格
```
```
用户：做一个产品介绍PPT，主题科技感，需要有数据对比页
```
```
用户：做个汇报材料，内容是：[粘贴文字]
```
### 带详细要求
```
用户：帮我做PPT
主题：Python 学习入门
页数：8页
风格：简洁活泼
动画：需要有入场动画
```
---
## 📋 标准页面类型
| 布局类型 | 适用场景 |
|---------|---------|
| 封面页 | 标题、副标题、作者 |
| 目录页 | 章节导航 |
| 标题+要点 | 列举核心观点 |
| 左图右文 | 图文混排 |
| 数据大屏 | 核心指标展示 |
| 对比页 | 方案A vs B |
| 时间线 | 里程碑、历史 |
| 引用页 | 金句、名言 |
| 谢谢页 | 结尾 |
---
## 🎨 主题风格指南
### 商务类
- **Corporate Blue** — 深蓝+白，正式商务汇报
- **Executive Dark** — 深色背景，高端感
- **Clean Minimal** — 极简白，苹果风
### 科技类
- **Tech Purple** — 紫色渐变，科技感
- **Neon Cyber** — 霓虹配色，未来感
- **Data Viz** — 数据可视化专用
### 活泼类
- **Colorful Pop** — 多彩活泼，教育培训
- **Pastel Soft** — 马卡龙色，柔和清新
- **Bold Gradient** — 大胆渐变，创意展示
---
## ⚙️ 生成流程
```
1. 解析需求
↓ 主题 / 页数 / 风格 / 内容
2. 选择模板
↓ 匹配最适合的主题 + 布局组合
3. 填充内容
↓ 自动排版文字、数据、图表
4. 添加动画
↓ 根据风格选择合适的动画效果
5. 输出 HTML
↓ 单文件，浏览器直接打开展示
```
---
## 📝 输出规范
- **格式**：单个 `.html` 文件，可直接用浏览器打开
- **尺寸**：16:9 宽屏（1920×1080）
- **字体**：内嵌字体，无需安装
- **导出**：浏览器打印 → 另存为 PDF
---
## 💡 使用示例
### 示例1：工作汇报
```
用户：帮我做一个周报PPT，内容如下：
本周完成：用户中心功能开发、SQL优化
下周计划：对接支付模块、写单测
遇到问题：Redis缓存穿透问题
助手：→ 生成3页简洁商务风PPT
封面页：周报 2026-W18
本周成果页：✅ 用户中心功能 ✅ SQL优化
下周计划页：支付模块 + 单测
```
### 示例2：技术分享
```
用户：帮我做一个"MySQL索引优化"技术分享PPT，8页，科技风
助手：→ 生成8页Tech主题PPT
Page 1: 封面
Page 2: 目录（索引原理、类型、实战）
Page 3-7: 内容页（含代码高亮）
Page 8: Q&A
```
---
*"PPT 的未来是 HTML" —— lewislulu*