Skip to content
Get packs

HTML Presenter Mode Deck

Builds a presenter-style HTML slide deck for a live AI product demo, using a shared template.

Source Download skill
Repository
nexu-io/open-design
Stars
105,448
Licence
Apache-2.0
Files
2 files

What it does

This skill tells an AI agent how to build a slide deck as a single web page (HTML) that presents a product demo or AI literacy talk. It points the agent to a specific visual template called presenter-mode-reveal, copies its styling and navigation code into your project, and keeps speaker notes hidden from the slides themselves. Once installed, asking the agent for a demo deck gives you a styled, keyboard-navigable HTML presentation instead of a generic outline.

Great for

  • Developers or developer-relations staff preparing a live product demo deck
  • Teams who want a web-based slide deck they can open in any browser
  • People who want the exact look of the presenter-mode-reveal template

Skip it if

  • Users who need a PowerPoint or Google Slides file, since this outputs HTML only
  • Anyone wanting a generic deck without this template's visual identity, because the skill locks in that specific style
  • Users expecting the skill to work standalone; it depends on the separate html-ppt master skill and its files, which are not included in this folder

Try asking

  • “Create a live AI product demo deck for developers using the presenter-mode-reveal template”
  • “Build an HTML slide deck with speaker notes for a community talk about AI copilots”
  • “Turn a one-line product pitch into a decision-focused AI literacy presentation in HTML”
Step-by-step guide: how to use HTML Presenter Mode DeckInstall, first run, examples, tips and FAQs

Install in 3 steps

  1. 1

    Download the skill

    The ZIP contains the 2 original files, the Apache-2.0 licence and an attribution note.

    html-ppt-presenter-mode-reveal.zip
  2. 2

    Add it to your agent

    Claude Code (all projects)

    mkdir -p ~/.claude/skills && unzip html-ppt-presenter-mode-reveal.zip -d ~/.claude/skills/

    Claude Code / Agent SDK (this project only)

    mkdir -p .claude/skills && unzip html-ppt-presenter-mode-reveal.zip -d .claude/skills/

    Claude apps (web/desktop): Settings → Capabilities → Skills → Upload skill, and choose the ZIP.

  3. 3

    Ask for the task

    No special command needed — the agent reads the skill's description and loads it when your request matches. Try one of the prompts above.

Get better results

  • Install the full open-design repository, not just this folder, because the skill references files in sibling directories that must exist.
  • Choose Recipe A (copy assets locally) so the deck still loads after you move the HTML file out of the template folder.
  • Keep speaker notes inside the notes element so they never appear on the projected slides.

What's inside

  • example.html
  • SKILL.md

Redistributed unmodified from nexu-io/open-design under the Apache-2.0 licence. The assessment was drafted with AI from the skill's files on 2026-10-29. Skills can instruct your agent to run code — read SKILL.md and any scripts before installing.