guizang-ppt-skill: a skill that builds one-file HTML slide decks with presenter mode

guizang-ppt-skill makes your agent build a one-file HTML slide deck in a magazine or Swiss style, with speaker notes and a presenter view.

Installs: 28.1K; on skills.sh
Stars: 29.1K; on GitHub
Updated: Oct 2026; last commit

The skill produces a horizontal-swipe web deck in a single HTML file that you open in a browser. You pick Style A, an editorial magazine look with serif headings and a WebGL background, or Style B, a Swiss look with a grid and one high-contrast accent color. If you give only a topic, the agent asks 7 clarifying questions. It then copies a template, fills the slides from locked layouts, then checks the result.

The skill text is written in Chinese and the README comes in English and Chinese. It can add speaker notes and timing, and the deck has a presenter mode with an audience window. It needs an agent with filesystem and shell access, and it asks before it updates itself.

Good for

Speakers preparing a keynote, salon talk or product launch
Founders and engineers who want a designed deck from an article or outline
Designers who want a deck that matches a brand color

Install guizang-ppt-skill

Claude Code

Copy this prompt.

Install the guizang-ppt-skill skill in Claude Code. Run this command:

npx skills add https://github.com/op7418/guizang-ppt-skill --skill guizang-ppt-skill

Then check that it loaded and tell me how to use it.

2
Paste it into Claude Code. It shows the change and asks before running it.

Requires Node.js.

From its listing on skills.sh. Source.

What's in the skill

When it loads

生成横向翻页网页 PPT（单 HTML 文件），含 WebGL 背景、演讲者视图、观众屏同步、讲稿备注、章节幕封、数据大字报、图片网格等模板。提供两种风格：① "电子杂志 × 电子墨水"（衬线 + 流体背景 + 暖色） ② "瑞士国际主义"（无衬线 + 网格点阵 + IKB/柠檬黄/柠檬绿/安全橙高亮）。当用户需要制作分享 / 演讲 / 发布会风格的网页 PPT，或提到"杂志风 PPT"、"瑞士风 PPT"、"Swiss Style"、"horizontal swipe deck"时使用。

Sections in SKILL.md

这个 Skill 做什么
风格 A · 电子杂志 × 电子墨水（默认）
风格 B · 瑞士国际主义（Swiss Style）
何时使用
工作流
Step 0 · 启动前检查更新（必做）
Step 1 · 需求澄清(动手前必做)
Step 2 · 拷贝模板
Step 3 · 填充内容
Step 4 · 对照检查清单自检
Step 5 · 本地预览
Step 6 · 迭代
资源文件导览
核心设计原则（哲学）
风格 A · 电子杂志风（5 轮迭代总结）
风格 B · 瑞士国际主义风

Key facts

Author: 歸藏 (Guizang, op7418)
Repo: op7418/guizang-ppt-skill (skill is at the repo root)
Installs on skills.sh: 28,128 (as of Nov 2, 2026)
GitHub stars: 29,080 (Nov 2, 2026)
License: AGPL-3.0
Last repo commit: Oct 30, 2026
skills.sh audits: Gen Agent Trust Hub: pass. Socket: pass. Snyk: pass.
Files: 43 in the repo including SKILL.md: 2 templates, 12 reference guides, 4 scripts, 9 background images, a Motion One copy and docs
Works in: Claude Code and Codex supported; Cursor and other local agents with filesystem and shell access

What it includes

Checks the upstream repo for updates and asks before pulling
Runs `git fetch` and counts new commits. Pulls only after you agree, and carries on if there is no network or the folder is not a git repo.
Runs code · Step 0: update check
Style, audience, length, source material, images, theme color, constraints
Asked before any slide is written. In Codex they are plain chat questions.
Step 1: 7 questions
Copies template.html or template-swiss.html to your project
Creates an images/ folder next to index.html and asks you to replace the placeholder title text.
Write · Step 2: copy a template
Locked layouts: 10 for Style A, 22 for Style B
Style B pages must come from the 22 locked layouts and carry a data-layout tag. Normal pages also get speaker notes.
Write · Step 3: fill the content
Runs validators and a checklist
node scripts/validate-presenter-mode.mjs for both styles and validate-swiss-deck.mjs for Style B, then checklist.md. Also asks to open the page in a browser.
Runs code · Step 4: self-check
gz-theme.mjs turns a brand color into a constrained theme
`node scripts/gz-theme.mjs brand "#4D6BFE" --family magazine` prints CSS to paste in. It refuses a color that fails contrast checks.
Runs code · Brand color theme
Asks whether to generate pictures for the deck
Only in Codex and only after you say yes. Screenshots can be framed with the bundled backgrounds.
Write · Optional images (Codex)
Press P in the deck
Audience window, 16:9 current and next previews, notes, timers, rehearsal log, auto-advance, laser pointer and circles.
Presenter mode

From the official docs

Permissions

Low risk

It copies files into your project and runs local node scripts. Network use is an update check with git fetch (the pull needs your yes), CDN fonts and icons when you open a deck, and optional image generation in Codex.

What it can do

Read your data
Create and change things
Delete things
Read-only mode

Watch out for

It runs git commands in the skill folder
Step 0 runs `git fetch` and, only after you agree, `git pull --ff-only` in the skill's own folder. Say no if you do not want it to update itself. github.com
It runs bundled node scripts
It runs validate-presenter-mode.mjs, validate-swiss-deck.mjs and, for brand colors, gz-theme.mjs from the skill folder against your deck. validate-swiss-deck.mjs launches headless Chromium through Playwright for rendered measurements when Playwright can be resolved, and skips them otherwise. github.com
AGPL-3.0 license
The README lists AGPL-3.0. Read the license if you plan to build a hosted product on the skill or its templates. github.com

Technical details

Talks to	The skill's upstream git remote (update check, asks before pulling). Font and icon CDNs when the deck is opened in a browser (SKILL.md says there is a local Motion copy too)

Questions

What does guizang-ppt-skill do?

It makes your agent build a horizontal-swipe slide deck as one HTML file, in an editorial magazine style or a Swiss grid style, with speaker notes and a presenter mode you open in a browser.

How do I install it in Claude Code?

Use the install command in the box above. The README also shows cloning the repo into ~/.claude/skills/guizang-ppt-skill. A clone lets the update check in Step 0 work; with other install methods SKILL.md says it cannot check and carries on.

Does it work in Codex or Cursor?

The README lists Codex as supported and Cursor and other local agents as working if they have filesystem access and shell execution. A plain chatbot is not recommended. Image generation is described for Codex only.

Is it safe to run?

It copies templates into your project, runs local node scripts and may run git pull --ff-only in its own folder after asking you. The deck loads fonts and icons from CDNs when opened. validate-swiss-deck.mjs launches a headless Chromium on your deck if Playwright can be found.

Does it need an API key or internet?

Neither SKILL.md nor the README asks for an API key to build a deck. The README says presenter mode, notes, timing and rehearsal run locally in the browser. The update check and the CDN fonts use the network, and picture generation is an optional Codex feature.

Can I use my brand colors?

Yes. SKILL.md runs gz-theme.mjs on your color and pastes the resulting theme into the deck. The script refuses colors that fail contrast checks, and arbitrary custom colors are otherwise not allowed.

Can I use it for English decks?

The SKILL.md instructions are in Chinese, and the README has an English edition. SKILL.md says text inside generated images should follow the language the user is using.

When should I not use it?

The README lists data-heavy tables, training decks (density too low) and multi-user collaborative editing as poor fits, since the deck is a static HTML file.

Information

updated Nov 2, 2026

Repository: op7418/guizang-ppt-skill

op7418/guizang-ppt-skill skills.sh

Sources

Docs, issue trackers and discussions this page is built from.

Show all 3

guizang-ppt-skill SKILL.md · github.com
guizang-ppt-skill README (English) · github.com
scripts/validate-swiss-deck.mjs · github.com