將 AI 生成的 HTML 投影片轉成 PPTX：實用流程與限制

AI assistants have become surprisingly good at producing slide decks as a single HTML file. Ask Claude or ChatGPT for "a 10-slide presentation on our Q4 roadmap" and you often get a self-contained page with sections, CSS and maybe a little JavaScript for navigation. It looks great in a browser. Then someone in the meeting says, "Can you send me the PowerPoint?"

This post walks through how I handle that hand-off, what can go wrong, and where the limits are.

Why HTML decks are attractive in the first place

• Version control. HTML is text, so diffs are readable and PRs work.
• Styling power. CSS grid, custom properties and web fonts give you layouts that are painful in slide software.
• AI-friendly. LLMs write HTML fluently, and they are much worse at producing valid OOXML directly.
• Portability. Any browser can present it.

The problem is that most organisations still run on .pptx. Decks get forwarded, opened on locked-down laptops and dropped into shared drives where HTML files look suspicious.

Option 1: Print to PDF

The quickest route is Ctrl+P → Save as PDF with a page size matching your slide aspect ratio. It works, but:

• Many recipients specifically ask for PPTX, not PDF.
• Page breaks depend on your print CSS, and @page and break-after: page need care.
• Animations and speaker notes are gone.

Still, adding print styles is worth doing anyway:

@page { size: 1280px 720px; margin: 0; }
section.slide { width: 1280px; height: 720px; break-after: page; }

Option 2: Rebuild in a library like python-pptx or PptxGenJS

If you need truly editable text boxes and shapes, you can generate the deck programmatically. This gives full control, but it means maintaining a second rendering of the same content. Every layout change in HTML must be mirrored in code. For one-off decks, that is rarely worth it.

Option 3: Convert in the browser to a static PPTX

For most "just send me the PowerPoint" situations, I use a browser-based converter. SlideBeaver opens the HTML deck locally, shows a preview of each slide, lets me make small visual adjustments to text and spacing, and exports a PPTX. Everything runs in the browser, so the deck is not uploaded anywhere.

The important caveat is that the output is a static PPTX. Each slide renders the way it looked in the preview, which is what you want for sharing and presenting. It is not a conversion into native, fully editable PowerPoint objects, and it does not embed your web fonts. If the recipient needs to rewrite every bullet in PowerPoint, Option 2 is the honest answer.

Common problems and how to fix them

Fonts look different. Web fonts loaded from a CDN may not have finished loading when the slide is captured. Self-host the font or wait for document.fonts.ready before you export.

Slides overflow. AI-generated decks often assume a scrolling page. Constrain each slide to a fixed box, such as 1280×720, and use overflow: hidden while you debug.

Interactive bits disappear. Accordions, hover states and canvas animations become a single frame. Decide which state you want to capture before exporting.

Images are missing. Relative paths break if you open only the HTML file. Inline small images as data URIs or keep the folder structure intact.

Prompting the AI for convertible decks

You can save yourself time by asking the model for a stricter structure up front:

Create a 16:9 HTML slide deck. Each slide is a <section class="slide"> fixed at 1280×720 px. Use system fonts. No JavaScript-dependent content. Keep text within the slide bounds.

Decks built like this convert cleanly far more often.

When to choose which option

Wrapping up

HTML is a great authoring format for slides, especially with AI in the loop. Keep HTML as the source of truth, add print-friendly CSS, and use a converter when you need a PPTX to share. Just be clear with collaborators about what "PowerPoint version" means: a faithful static copy is not the same thing as a fully editable deck.

How do you handle the HTML-to-PowerPoint hand-off on your team? I am curious what other workflows people use.