01 / 10
Claude Code & OpenClaw Skill · v1.4

slide-creator

零依赖 HTML 演示文稿,直接在浏览器运行。
无需 npm · 无需构建工具 · 无需下载 Chromium

13
种设计风格
0
外部依赖
1
行命令安装
设计哲学

四大核心理念

📦

零依赖

单文件内联 CSS/JS,用任何浏览器打开,分享一个文件,永久可用。

👁️

看图选风格

人无法用语言描述设计偏好——先生成 3 个视觉预览,让你直接反应,而非猜想。

有个性的设计

拒绝 Inter 字体、紫色渐变、千篇一律的 Hero 布局。每个演示文稿都应独特。

📐

视口精确填充

每张幻灯片恰好填满 100vh,绝不出现幻灯片内滚动条。内容溢出就分页,不压缩。

使用方式

三种创建方式,按需选择

A

交互式 — 先看风格再生成

/slide-creator # 回答 4 个问题 → 看 3 个预览 → 生成完整幻灯片
B

两阶段 — 先规划,再生成(复杂内容推荐)

/slide-creator --plan 我的 AI 创业公司融资路演
# 审阅 PLANNING.md 大纲后
/slide-creator --generate
C

PPT 转换 — 放入 .pptx 文件,自动识别转换

/slide-creator # 自动检测当前目录的 .pptx 文件
风格探索

「惊喜时刻」——看图而非描述

第一步:问你的感受

想要震撼自信?充满活力?沉静专注?还是有个性?

🎨

第二步:3 个视觉预览

真实的字体、配色和动画效果,不是描述,是实物。

第三步:选一个,立刻生成

选 A/B/C 或混合元素,完整幻灯片即刻生成。

已经知道想要什么风格?直接指定跳过探索:
/slide-creator --generate 用 Blue Sky 风格做我的季度汇报
设计预设

13 种精心设计的风格,拒绝 AI 审美

Bold Signal
路演 · 主题演讲
Electric Studio
商务演示
Creative Voltage
创意提案
Dark Botanical
高端品牌
Blue Sky ✨
产品 · 科技路演
Notebook Tabs
报告 · 评审
Pastel Geometry
产品介绍
Split Pastel
创意机构
Vintage Editorial
个人品牌
Neon Cyber
科技创业
Terminal Green
开发工具
Swiss Modern
企业 · 数据
Paper & Ink
叙事演讲
特色风格

Blue Sky — 你正在看的就是它

天空渐变背景

#f0f9ff → #e0f2fe,叠加 SVG 噪点纹理

玻璃拟态卡片

rgba(255,255,255,0.7) · backdrop-filter: blur(24px)

3 个动态环境光球

每页重新定位 · 80px 模糊 · 弹簧缓动过渡

弹簧物理横向切换

Horizontal track · cubic-bezier(0.22, 1, 0.36, 1)

40px 科技网格底层

6% 透明度 · 径向遮罩向边缘渐隐

封面云朵特效

仅封面页 · CSS blur 圆形簇 · 漂浮动画

渐变标题文字

#1e3a8a → #3b82f6,深海军蓝到亮蓝

胶囊分页指示点

当前页展开为胶囊形,其余为圆点

内容规范

视口填充 — 不可妥协的底线

幻灯片类型 内容上限
标题页1 个标题 + 1 个副标题
内容页1 个标题 + 4–6 条要点
功能网格1 个标题 + 最多 6 个卡片(2×3 或 3×2)
代码页1 个标题 + 8–10 行代码
引用页1 段引用(最多 3 行)+ 来源
拿不准就分页。幻灯片出现滚动条等同于破损。内容溢出时拆分到下一页,而不是压缩字号硬塞。
导出

PPTX 导出 — 用你已有的 Chrome

1

运行导出命令

/slide-creator --export pptx
2

Playwright 调用系统已安装的 Chrome

Chrome / Edge / Brave 均可 · 无需下载 300MB Chromium · 无需 Node.js

3

像素级还原 PPTX

逐张截图 · 组装为原生 .pptx · 可直接在 PowerPoint 中打开

前置依赖:pip install playwright python-pptx
安装

一行命令,重启即用

Claude Code

git clone https://github.com/kaisersong/slide-creator ~/.claude/skills/slide-creator

重启 Claude Code · 使用 /slide-creator 调用

OpenClaw · 通过 ClawHub 安装(推荐)

clawhub install html-slide-creator

自动安装全部依赖 · clawhub.ai/skills/html-slide-creator

Python 3 Pillow(图片处理) python-pptx(PPT 导入导出) playwright(PPTX 导出)
开始创作

你的下一个演示文稿
从一行命令开始

/slide-creator --plan 我的季度汇报
# 审阅 PLANNING.md 大纲,满意后继续
/slide-creator --generate
# → presentation.html 自动在浏览器中打开
13 种风格 交互式风格探索 PPTX 导出 零外部依赖

github.com/kaisersong/slide-creator · clawhub.ai/skills/html-slide-creator