Skip to main content

HTML Deck

Edit HTML slides, reports and pages yourself, without burning tokens.

Fix a typo, change a color or move a block right in the browser, no AI needed. Leave notes for the changes that need the agent.

CI PyPI npm Python 3.11+ License: MIT

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

Editing a slide title in HTML Deck

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 it yourself. Click to change text, colors, fonts, images, layout and effects. No agent needed.
  • Point the agent to the exact spot. For bigger changes, pin an AI Feedback note on a block or an area ("make this shorter"). The agent knows 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 panel with a block note and a region note Presenting a deck
AI Feedback: notes for your agent Present with the deck's own animations
Retyping a label inside an SVG architecture diagram
Diagrams: retype a label inside a diagram

Install

Where Command
Claude Code /plugin marketplace add avis309/html-deck then /plugin install htmldeck@htmldeck
Codex codex plugin marketplace add avis309/html-deck then codex plugin add htmldeck@htmldeck
uv uvx htmldeck · uv tool install htmldeck
pipx / pip pipx install htmldeck · pip install htmldeck
npm npx @avis309/htmldeck · npm i -g @avis309/htmldeck

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 [file] in Claude Code).
  2. Edit what you can. Pin AI Feedback notes for the rest.
  3. Say "apply my HTML Deck notes". The agent makes the changes and marks the notes done. Reload the document in HTML Deck to see them.

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). 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

Documents Plain HTML pages, reports, and decks of .slide blocks, written by hand or by an agent.
Reveal.js Hand-written decks: stacks, fragments, speaker notes, backgrounds. Markdown slides are read-only.
Tailwind CSS Classes stay as written; your styles go on top.
SVG Retype a <text> / <tspan> label in an inline <svg>.
Animations The page's own scripts (anime.js, GSAP…) run when presenting a file from the workspace. While editing, CSS and Web Animations are paused, and content a script changes is locked. Add data-fx entrance effects from the toolbar.
Safety Undo/redo, draft recovery, backups. Remote scripts (a CDN, for example) are blocked while editing until you trust the file; presenting runs on a separate origin.
Details for developers

Workspace. The current folder, or --root. Nothing outside it is served or written. A --file outside it makes its folder the workspace (unless --root is given).

Saving. The source is patched where you edited; when a document can't be patched, the editor asks before rewriting it. Backups are kept for files from the workspace (not for a file opened from your computer).

Files opened from your computer (or dropped in) rather than from the workspace run none of their own scripts, even when presenting; HTML export saves the edited file without embedding its images and styles; AI Feedback is off.

Export. HTML export embeds linked images, styles, scripts and fonts; resources it can't fetch stay as links. From a terminal: python -m htmldeck.export --file <file>.html --remote (--remote also embeds web resources). PDF uses the browser's print dialog.

AI Feedback. Notes are stored in .htmldeck_notes/<name>.json beside the document. Each note records the element's selector, a text snippet and its source line; a region note also records the area and the elements in it.

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

Develop.

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

Server: htmldeck/server.py. Editor: htmldeck/web/js/ (native ES modules, no bundler; app.mjs boots it; npm run lint also checks that imports only go down the layers and never form a cycle). Browser specs: tests/spec/. Release: python tools/bump_version.py X.Y.Z, commit, tag vX.Y.Z, push the tag.

License

MIT © Avis

Metadata

Release files for htmldeck 0.1.7

For a detailed explanation of source distributions (sdists) and built distributions (wheels), please see the package formats documentation.

Source distribution (sdist)

Source distribution for htmldeck 0.1.7
File Size Uploaded
htmldeck-0.1.7.tar.gz 202.5 kB Details

Built distribution (wheel)

Table of built distributions (wheels) for htmldeck 0.1.7
File Interpreter ABI Platform
htmldeck-0.1.7-py3-none-any.whl Python 3 none any Details

Total release size: 419.4 kB

Release files / htmldeck-0.1.7.tar.gz

Download URL htmldeck-0.1.7.tar.gz
Size 202.5 kB
Tags Source
SHA-256 checksum
How to use checksums
5cf5bdc61f6e5cc97352bab1c2e32879adbd7639c2d491ae17c36c343989cf85
BLAKE2b-256 checksum
How to use checksums
dfd81e9316c0c542feadeb1a6ea92f353d0cb5d570be47059350bb1ea9ce6087
Upload date
Uploaded using Trusted Publishing?
What is trusted publishing?
Yes
Uploaded via twine/7.0.0 CPython/3.13.14

Provenance

Provenance describes where a file came from. On PyPI, provenance is shared via attestations, which provide a verifiable record of the build or publishing details. View details, limitations and caveats.

PyPI Publish Attestation

PyPI verified that this artifact, at this checksum, originated from the publisher listed below.

Signed by GitHub Actions, verified by PyPI on Oct 8, 2026.

Transparency log

Release files / htmldeck-0.1.7-py3-none-any.whl

Download URL htmldeck-0.1.7-py3-none-any.whl
Size 216.9 kB
Tags Python 3
SHA-256 checksum
How to use checksums
f818c83f174c32ddc89b19c22ec2f52f021f7341b476bfedc10e81852c040606
BLAKE2b-256 checksum
How to use checksums
50a63d361855afe83514eefe77685c471c262c51c03be9201673825fa3c10319
Upload date
Uploaded using Trusted Publishing?
What is trusted publishing?
Yes
Uploaded via twine/7.0.0 CPython/3.13.14

Provenance

Provenance describes where a file came from. On PyPI, provenance is shared via attestations, which provide a verifiable record of the build or publishing details. View details, limitations and caveats.

PyPI Publish Attestation

PyPI verified that this artifact, at this checksum, originated from the publisher listed below.

Signed by GitHub Actions, verified by PyPI on Oct 8, 2026.

Transparency log

Release history Release notifications | RSS feed

0.1.12

2 release files

0.1.9

2 release files

0.1.8

2 release files

This release

0.1.7 This release

2 release files

0.1.6

2 release files

0.1.5

2 release files

0.1.4

2 release files

0.1.3

2 release files

0.1.2

2 release files

0.1.1

2 release files

0.1.0

2 release files

Anthropic, PBC Visionary sponsor Bloomberg Visionary sponsor Hudson River Trading Visionary sponsor Meta Visionary sponsor NVIDIA Visionary sponsor Microsoft Sustainability sponsor Depot Continuous Integration AWS Cloud computing and Security Sponsor Datadog Monitoring Fastly CDN Google Download Analytics Sentry Error logging StatusPage Status page