Frontend Slides
zarazhangrui/frontend-slides
Builds animated HTML slide decks that run in the browser with no dependencies, or converts PowerPoint files to the web, starting from visual style previews.
HTML PPT 精致演示文稿设计器 - 将用户内容转化为精致的HTML演示文稿页面,LLM 智能设计优先,支持多种视觉风格、动效设计、色彩认知系统。触发词:PPT、演示文稿、HTML幻灯片、slide、presentation、做PPT、制作演示。
$ npx skills add andyhuo520/html-ppt-designer --skill html-ppt-designer -a claude-codeProject install by default; add -g for ~/.claude/skills/.
$ gh skill install andyhuo520/html-ppt-designer html-ppt-designer --agent claude-codeProject scope by default; add --scope user for a personal install. Needs GitHub CLI 2.90.0 or later (public preview).
Claude Code skills documentation · loads skills from .claude/skills/
Install the "html-ppt-designer" agent skill from https://github.com/andyhuo520/html-ppt-designer/tree/master into .claude/skills/html-ppt-designer/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "html-ppt-designer", then confirm the skill loads.Claude Code copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.
$ npx skills add andyhuo520/html-ppt-designer --skill html-ppt-designer -a codexProject install goes to .agents/skills/; add -g for ~/.codex/skills/.
$ gh skill install andyhuo520/html-ppt-designer html-ppt-designer --agent codexProject scope by default (.agents/skills/); add --scope user for a personal install.
Codex skills documentation · loads skills from .agents/skills/
Install the "html-ppt-designer" agent skill from https://github.com/andyhuo520/html-ppt-designer/tree/master into .agents/skills/html-ppt-designer/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "html-ppt-designer", then confirm the skill loads.Codex copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.
$ npx skills add andyhuo520/html-ppt-designer --skill html-ppt-designer -a cursorProject install goes to .agents/skills/; add -g for ~/.cursor/skills/.
$ gh skill install andyhuo520/html-ppt-designer html-ppt-designer --agent cursorProject scope by default (.agents/skills/); add --scope user for a personal install.
Cursor skills documentation · loads skills from .cursor/skills/, .agents/skills/, .claude/skills/, .codex/skills/
Install the "html-ppt-designer" agent skill from https://github.com/andyhuo520/html-ppt-designer/tree/master into .cursor/skills/html-ppt-designer/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "html-ppt-designer", then confirm the skill loads.Cursor copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.
$ npx skills add andyhuo520/html-ppt-designer --skill html-ppt-designer -a gemini-cliProject install goes to .agents/skills/; add -g for ~/.gemini/skills/.
$ gh skill install andyhuo520/html-ppt-designer html-ppt-designer --agent gemini-cliProject scope by default (.agents/skills/); add --scope user for a personal install.
Gemini CLI skills documentation · loads skills from .gemini/skills/, .agents/skills/
Install the "html-ppt-designer" agent skill from https://github.com/andyhuo520/html-ppt-designer/tree/master into .gemini/skills/html-ppt-designer/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "html-ppt-designer", then confirm the skill loads.Gemini CLI copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.
$ gh skill install andyhuo520/html-ppt-designer html-ppt-designerInstalls for Copilot at project scope by default; add --scope user for a personal install. Preview a skill first with gh skill preview. Needs GitHub CLI 2.90.0 or later (public preview).
$ npx skills add andyhuo520/html-ppt-designer --skill html-ppt-designer -a github-copilotProject install goes to .agents/skills/; add -g for ~/.copilot/skills/.
GitHub Copilot skills documentation · loads skills from .github/skills/, .claude/skills/, .agents/skills/
Install the "html-ppt-designer" agent skill from https://github.com/andyhuo520/html-ppt-designer/tree/master into .github/skills/html-ppt-designer/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "html-ppt-designer", then confirm the skill loads.GitHub Copilot copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.
$ npx skills add andyhuo520/html-ppt-designer --skill html-ppt-designer -a opencodeOpenCode documents no install command of its own. Project install goes to .agents/skills/; add -g for ~/.config/opencode/skills/.
$ gh skill install andyhuo520/html-ppt-designer html-ppt-designer --agent opencodeProject scope by default (.agents/skills/); add --scope user for a personal install.
OpenCode skills documentation · loads skills from .opencode/skills/, .claude/skills/, .agents/skills/
Install the "html-ppt-designer" agent skill from https://github.com/andyhuo520/html-ppt-designer/tree/master into .opencode/skills/html-ppt-designer/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "html-ppt-designer", then confirm the skill loads.OpenCode copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.
html-ppt-designerHTML PPT 精致演示文稿设计器 - 将用户内容转化为精致的HTML演示文稿页面,LLM 智能设计优先,支持多种视觉风格、动效设计、色彩认知系统。触发词:PPT、演示文稿、HTML幻灯片、slide、presentation、做PPT、制作演示。
HTML Ppt Designer is an agent skill from andyhuo520/html-ppt-designer. HTML PPT 精致演示文稿设计器 - 将用户内容转化为精致的HTML演示文稿页面,LLM 智能设计优先,支持多种视觉风格、动效设计、色彩认知系统。触发词:PPT、演示文稿、HTML幻灯片、slide、presentation、做PPT、制作演示。
Its SKILL.md is about 14k tokens, which your agent loads only when the skill is triggered. The skill folder holds 38 other files, including scripts and reference files (for example `README.md`, `SKILL-TEMPLATE-GUIDE.md` and `STYLES.md`).
It sits in Documents & Office, covering Slides and decks. The repository describes itself as: HTML PPT Designer v5.2 - 智能演示文稿设计器,将任何内容转化为精致的 HTML 演示文稿.
10 steps, taken from the step headings in SKILL.md.
Read from SKILL.md and the folder at commit 17b6610. It shows what the files ask for, not the result of running them.
Pre-approves these tools, so the agent can use them without asking each time:
BashReadWriteEditGlobGrepAskUserQuestionFrom allowed-tools in the SKILL.md frontmatter.
Ships 1 file in scripts/, which the agent can run.
Shell commands in SKILL.md call:
python3brewpipplaywrightclaudeFrom the folder's file list and the shell code blocks in SKILL.md.
Hosts in commands or code, which the agent is likely to contact:
youtu.befonts.googleapis.comxiaoyuzhoufm.comcode.iconify.designcdn.jsdelivr.netAlso links to:
unsplash.comzenmux.aiplatform.openai.comconsole.volcengine.comopen.bigmodel.cnaistudio.google.comFrom URLs in SKILL.md, links to its own repository left out.
Names these keys or tokens, usually read from environment variables:
UNSPLASH_ACCESS_KEYZENMUX_API_KEYOPENAI_API_KEYZHIPUAI_API_KEYGEMINI_API_KEYVOLCENGINE_ACCESS_KEYVOLCENGINE_SECRET_KEYFrom names ending in _API_KEY, _TOKEN, _SECRET, _KEY or _PASSWORD in SKILL.md.
HTML Ppt Designer loads about 14k tokens when it runs, and up to ~34k if it reads all its reference files. Until then it costs about 36 tokens; SKILL.md has 1,827 words of instructions outside code blocks.
Estimates: characters ÷ 4, the usual rule of thumb; real counts depend on the model's tokenizer. Scripts and assets cost tokens only if the agent reads them.
The automated check noted patterns worth knowing about, such as sudo or a known installer.
allowed-tools: Bash, Read, Write, Edit, Glob, Grep, AskUserQuestionAutomated static check — not a guarantee. Review scripts before installing. It scans the text of SKILL.md for risky patterns (piping downloads into a shell, reading credential files, hidden Unicode, destructive commands); the scripts in this folder are not scanned.
Without a licence we can't republish the file, so here is its outline and opening line. It has 1,827 words (~14,460 tokens).
“版本: 5.2 架构: LLM 智能设计优先 + 本地模板 fallback + 原文配图提取 + Unsplash 配图 + 真翻页引擎 + 6 种动画 + 视频播客模式 + 内嵌字幕 + 国产 TTS + 纯色设计 + 默认图标装饰 + 控制面板自动隐藏 更新日期: 2026-02-13”
SKILL.md and 35 other files (scripts, references) in the repository root of andyhuo520/html-ppt-designer.
Open the folder on GitHubat commit 17b6610
HTML Ppt Designer next to the 5 skills that share the most tags, products or categories with it. Stars are the repository's; “used in” counts other GitHub owners with a copy.
| Skill | Stars | Used in | Tokens | Auto-check | Licence | Repo updated |
|---|---|---|---|---|---|---|
| HTML Ppt Designer this skillandyhuo520/html-ppt-designer | 121 | — | ~14k | Automated safety check: Notes | None | |
| Frontend Slideszarazhangrui/frontend-slides | 30k | 16 repos | ~7k | Automated safety check: Pass | MIT | |
| Single-File HTML Slide Decksop7418/guizang-ppt-skill | 27k | 1 repos | ~6.3k | Automated safety check: Pass | AGPL-3.0 | |
| Openkb Deck EditorialVectifyAI/OpenKB | 4.8k | 1 repos | ~2.1k | Automated safety check: Pass | Apache-2.0 | |
| Build iPolloWork TemplatesDevin-AXIS/iPolloWork | 6.8k | — | ~925 | Automated safety check: Pass | Custom licence | |
| Openkb HTML CriticVectifyAI/OpenKB | 4.8k | 1 repos | ~1.4k | Automated safety check: Pass | Apache-2.0 |
zarazhangrui/frontend-slides
Builds animated HTML slide decks that run in the browser with no dependencies, or converts PowerPoint files to the web, starting from visual style previews.
op7418/guizang-ppt-skill
Generates single-file HTML slide decks with horizontal paging, WebGL backgrounds and a presenter view, in an editorial-magazine style or a Swiss-style layout.
VectifyAI/OpenKB
A skill your agent uses when the user asks the openkb chat to make a deck / slide presentation / PPT / slides / 演示稿 / 幻灯片 from their compiled KB content.
Devin-AXIS/iPolloWork
Builds a reusable iPolloWork template for Design, Slides or PPT, or HyperFrames Video through conversation, keeping a manifest, reusable variables and a validated package current.
VectifyAI/OpenKB
A skill your agent uses to review a generated HTML deck or single-page artifact for visual quality and structural correctness.
petergyang/human-review
Open an HTML file, Markdown file, or localhost page in the browser so the user can edit text directly and leave comments on specific parts, then send all edits and comments back to you.
Categories
HTML PPT 精致演示文稿设计器 - 将用户内容转化为精致的HTML演示文稿页面,LLM 智能设计优先,支持多种视觉风格、动效设计、色彩认知系统。触发词:PPT、演示文稿、HTML幻灯片、slide、presentation、做PPT、制作演示。. HTML Ppt Designer is an agent skill from andyhuo520/html-ppt-designer.
HTML Ppt Designer fits situations like: tasks that involve Slides and decks.
Run `npx skills add andyhuo520/html-ppt-designer --skill html-ppt-designer -a claude-code`. Or copy the skill folder (the andyhuo520/html-ppt-designer repository) into .claude/skills/html-ppt-designer in your project. Claude Code loads it when a task matches its description.
Run `npx skills add andyhuo520/html-ppt-designer --skill html-ppt-designer -a codex`. Or copy the skill folder (the andyhuo520/html-ppt-designer repository) into .agents/skills/html-ppt-designer in your project. Codex loads it when a task matches its description.
Cursor, Gemini CLI, GitHub Copilot and OpenCode also load SKILL.md folders. With the skills CLI, run `npx skills add andyhuo520/html-ppt-designer --skill html-ppt-designer -a cursor` (or -a gemini-cli, github-copilot or opencode for the others). To copy it by hand, put the folder in .cursor/skills/html-ppt-designer, .gemini/skills/html-ppt-designer, .github/skills/html-ppt-designer and .opencode/skills/html-ppt-designer in your project.
Going by SKILL.md and its folder, HTML Ppt Designer needs the command-line tools its instructions call (python3, brew, pip, playwright and claude) and credentials named UNSPLASH_ACCESS_KEY, ZENMUX_API_KEY, OPENAI_API_KEY and ZHIPUAI_API_KEY. Our summary lists: A credential in UNSPLASH_ACCESS_KEY; A credential in ZENMUX_API_KEY. Its frontmatter pre-approves these tools: Bash, Read, Write, Edit, Glob, Grep, AskUserQuestion.
SKILL.md names 11 domains. In commands or code: youtu.be, fonts.googleapis.com, xiaoyuzhoufm.com, code.iconify.design and cdn.jsdelivr.net; the agent is likely to contact these when it follows the instructions. As links in the text: unsplash.com, zenmux.ai, platform.openai.com, console.volcengine.com, open.bigmodel.cn and aistudio.google.com. This is read from the text; nothing was executed.
Our automated static check of SKILL.md found notes only (pre-approves every shell command (allowed-tools: bash)), nothing it rates as a warning. It is not a guarantee. The check reads SKILL.md only: the scripts in the folder are not scanned, so read them before running anything.
No licence was found for HTML Ppt Designer or its repository. Without one, default copyright applies: ask the author before reusing or redistributing it.
About 14k tokens (SKILL.md is roughly 58k characters). Agents keep only the skill's name and description in context until a task matches; then they load SKILL.md in full. Its references folder adds about 19k tokens, read only when the agent opens those files.
Skills that share tags, products or a category with HTML Ppt Designer: Frontend Slides (zarazhangrui/frontend-slides, 30k stars), Single-File HTML Slide Decks (op7418/guizang-ppt-skill, 27k stars), Openkb Deck Editorial (VectifyAI/OpenKB, 4.8k stars) and Build iPolloWork Templates (Devin-AXIS/iPolloWork, 6.8k stars). The comparison table on this page puts their stars, adoption, token cost, safety result and licence side by side.
andyhuo520 (a GitHub user) maintains it in andyhuo520/html-ppt-designer, which has 121 GitHub stars. The repository was last updated on February 14, 2026.
Source: andyhuo520/html-ppt-designer on GitHub. Facts on this page come from the repository at the commit we read; the author's words are quoted as theirs.