一项世界级的代理技能，用于制作专业HTML演示文稿 36个主题，15个全套模板，36个页面布局， 47个动画（27个CSS + 20个画布特效），以及真正的主持人模式 像素完美的预览+扬声器脚本+定时器——全是纯静态画面 HTML/CSS/JS，没有构建步骤。

作者： 刘易斯·<[email protected]> 许可： 麻省理工学院 中文文档： README.zh-CN.md

One 命令安装36个主题×20个画布特效×36个布局×15个完整牌组+演示者模式。上面每个预览都是真实模板文件在牌组内实时渲染的iframe——没有截图，没有模型。

🎤 主持人模式（新！）

在任何一台牌组上按S，即可打开一个专门的演讲窗口，里面有四个 可拖动，可调整大小 磁卡：当前幻灯片，下一页预览， 扬声器脚本（逐字稿）和计时器。两个窗口通过以下方式保持同步 BroadcastChannel。

为什么预览是像素完美： 每张卡都是加载 同一套牌 HTML，带有 ?preview=N 查询参数。运行时检测到此点，且 渲染时只渲染 Slide N，没有 Chrome ——所以预览用的是相同的 CSS， 主题、字体和视口作为观众视角。颜色和布局为

html-ppt — HTML PPT Studio

A world-class AgentSkill for producing professional HTML presentations in 36 themes, 15 full-deck templates, 36 page layouts, 47 animations (27 CSS + 20 canvas FX), and a true presenter mode with pixel-perfect previews + speaker script + timer — all pure static HTML/CSS/JS, no build step.

Author: lewis <[email protected]> License: MIT 中文文档: README.zh-CN.md

One command installs 36 themes × 20 canvas FX × 36 layouts × 15 full decks + presenter mode. Every preview above is a live iframe of a real template file rendering inside the deck — no screenshots, no mock-ups.

🎤 Presenter Mode (new!)

Press S on any deck to pop open a dedicated presenter window with four draggable, resizable magnetic cards: current slide, next slide preview, speaker script (逐字稿), and timer. Two windows stay in sync via BroadcastChannel.

Why previews are pixel-perfect: each card is an `` that loads the same deck HTML with a ?preview=N query param. The runtime detects this and renders only slide N with no chrome — so the preview uses the same CSS, theme, fonts and viewport as the audience view. Colors and layout are guaranteed identical.

Smooth (no-reload) navigation: on slide change, the presenter window sends postMessage({type:'preview-goto', idx:N}) to each iframe. The iframe just toggles .is-active between slides — no reload, no flicker.

Speaker script rules (3 golden):

1. Prompt signals, not lines to read — bold the keywords, separate transition sentences into their own paragraphs
2. 150–300 words per slide — that’s the ~2–3 min/page pace
3. Write it like you speak — conversational, not written prose

See references/presenter-mode.md for the full authoring guide, or copy the ready-made template at templates/full-decks/presenter-mode-reveal/ which ships with full 150-300 word speaker scripts on every slide.

Install (one command)

npx skills add https://github.com/lewislulu/html-ppt-skill

That registers the skill with your agent runtime. After install, any agent that supports AgentSkills can author presentations by asking things like:

“做一份 8 页的技术分享 slides，用 cyberpunk 主题” “turn this outline into a pitch deck” “做一个小红书图文，9 张，白底柔和风”

Offline / manual install

npx skills add needs network on the target machine. Three alternatives, in decreasing order of how much network they need.

1. Install from a local copy. Fetch the repo anywhere, move the folder over (git, zip, USB), then point the CLI at the directory instead of the URL:

git clone https://github.com/lewislulu/html-ppt-skill
npx skills add ./html-ppt-skill

npx still downloads the skills package itself once. For a fully air-gapped