HTML Deck

A visual editor for the HTML slides, reports and pages your AI makes.

Edit what you see, right in the browser. Or mark every spot that needs work with AI Feedback and let your agent fix them all in one go.

🇬🇧 English • 🇻🇳 Tiếng Việt • 🇨🇳 中文 • 🇹🇼 繁體中文

Why

AI assistants like Claude Code and Codex are great at making slides and pages in HTML. Changing them is another story: even a one-word fix sends the AI back through a large file, which burns tokens and time, and it may touch things you didn't ask for.

• Edit what you see. Click on the page to change text, colors, fonts, images, layout and effects, WYSIWYG. A small fix takes seconds and no tokens.
• AI Feedback, in bulk. Select a block or sweep across an area and say what should change ("make this shorter"). Do it everywhere you need, then hand the whole list to your agent at once: it knows exactly what to change and where.
• Your file stays clean. Saving updates only the parts you edited, so the rest of the file is left as it was. If a full rewrite is ever needed, you are asked first.
• Present it. Show the deck full screen with its own animations.

AI Feedback: every change, one list for your agent	Present with the deck's own animations
Effects: pick one from the side bar, or animate the whole slide	Diagrams: retype a label inside a diagram

Install

Needs Python 3.11+ (the npm package also needs Node.js 18+). Linux, macOS and Windows.

Use

With Claude Code or Codex:

1. Say "open my deck in HTML Deck" (or type /htmldeck:open [file] in Claude Code).
2. Edit directly, or leave AI Feedback wherever you want the agent to change something.
3. Say "apply my HTML Deck notes". The agent makes the changes and marks the notes done. HTML Deck shows the new version as soon as the file changes.

On its own, in the folder with your files:

htmldeck                          # open the editor on the current folder
htmldeck --file <file>.html       # open that document first
htmldeck --root <folder> --port 6789 --no-browser

It runs on your computer (127.0.0.1), opened by the link it prints: that link carries a key for the run, so other programs on the machine cannot use the editor. Save keeps a backup of each version in .htmldeck_bak/. Save ▾ also gives you a copy to share: one HTML file with its images, styles and fonts built in, or a PDF. The editor starts in your browser's language; change it from the language menu.

Try it in a clone of this repo: htmldeck --root samples --file marketing-report.html.

Works with

htmldeck-notes --file <file>.html             # list open notes
htmldeck-notes --file <file>.html --prompt    # as a request ready to paste to an agent
htmldeck-notes --file <file>.html --done <id> # mark one done

python3 -m venv .venv && .venv/bin/pip install -e '.[dev]'
npm install
npm run check        # eslint + pytest + browser specs

License

MIT © Avis