HTML Slides
Single-file animated HTML decks with viewport-locked slides and keyboard/touch nav.
Test report
- Verdict
- Works with setup
- Score
- Tested
- Jul 14, 2026
- Environment
- Claude Code 2.x (agent harness)
- Upstream re-checked
- Aug 10, 2026 · 8bb96c3
Built the same 4-slide 'Q3 Product Roadmap' deck twice, once ignoring the skill and once following it strictly: the skill version replaced the baseline's scrollable body and purple-gradient-plus-Inter look (an anti-pattern the skill explicitly calls out by name) with locked 100dvh sections, clamp() type, keyboard/touch navigation, a progress bar, and prefers-reduced-motion support that the baseline had none of. The gap: the 'curated style presets' promised in the description live in a sibling skill folder that a standalone install of html-slides never pulls in.
Scored on four weighted criteria — install, triggering, output vs. baseline, docs. How scoring works
- Installs cleanly 4/5
- Triggers reliably 5/5
- Output vs. baseline 9/10
- Docs & honesty 3/5
What HTML Slides does
Generates single-file, self-contained HTML presentations with viewport-locked slides (100dvh, overflow:hidden), clamp()-based responsive type, CSS/GSAP reveal animations, keyboard and touch navigation, and a print stylesheet for PDF export. Triggers on requests for animated HTML decks, PPTX-to-HTML conversion, or single-file web presentations. The 'curated style presets' the description advertises actually live in a sibling skill folder (slide-design) that a standalone install of this skill does not include.
How to install HTML Slides
git clone https://github.com/proyecto26/slides-ai-plugin
cd slides-ai-plugin
mkdir -p ~/.claude/skills
cp -r skills/html-slides ~/.claude/skills/html-slides
Skills live in ~/.claude/skills/ (global) or .claude/skills/
(per-project). Restart Claude Code after installing.
Commands — how to trigger HTML Slides
-
/html-slidesSingle-file animated HTML decks with viewport-locked slides and keyboard/touch nav.
It also activates on plain-language prompts like these:
-
Build a 4-slide roadmap deck as one animated HTML file -
Make a keyboard-navigable slide deck for our Q3 review -
I need a self-contained HTML presentation with slide transitions
Frequently asked questions
- Is the HTML Slides skill free?
- Yes. The skill itself is free from proyecto26/slides-ai-plugin. SkillProof publishes the install command and an independent test verdict at no cost.
- Does HTML Slides work with Claude Code?
- We tested it with Claude Code 2.x (agent harness) on Jul 14, 2026. Verdict: Works with setup. Built the same 4-slide 'Q3 Product Roadmap' deck twice, once ignoring the skill and once following it strictly: the skill version replaced the baseline's scrollable body and purple-gradient-plus-Inter look (an anti-pattern the skill explicitly calls out by name) with locked 100dvh sections, clamp() type, keyboard/touch navigation, a progress bar, and prefers-reduced-motion support that the baseline had none of. The gap: the 'curated style presets' promised in the description live in a sibling skill folder that a standalone install of html-slides never pulls in.
- What is the HTML Slides SkillProof Score?
- 8.4/10 — installs cleanly 4/5, triggers reliably 5/5, output vs. baseline 9/10, docs & honesty 3/5.
- How do I install HTML Slides?
- Copy the install command from this page, run it in your terminal, and restart Claude Code. Skills live in ~/.claude/skills/ (global) or .claude/skills/ inside a project.
- Can I use HTML Slides with Cursor, Copilot, Gemini CLI, Codex or other AI tools?
- The SKILL.md format is native to Claude (Claude Code, Desktop, claude.ai). The instructions inside adapt to other assistants: Cursor rules, GitHub Copilot instructions, Windsurf rules, Custom GPTs, AGENTS.md for OpenAI Codex, and GEMINI.md for Google Gemini CLI — our conversion guides cover each, and the free converter on the tools page does the wrapping for you.