A Deck Is Made to Reach Someone
A deck is made to reach someone.
Clear enough to follow. Stylish enough to hold attention. Stylish for clients who like stylish. Restrained tonality for executives who want to feel safe. A slightly unconventional structure to surprise the senior buyer who has seen every pitch in the industry.
You read the audience. You shift the structure. You match the design. That has been the work for twenty years.
Just Let AI Make the Slides
That same person tried to hand the work over to AI.
The “AI presentation tools” out there did not pass. Templates that look cheap. Margins too tight. Typography with no opinion. Color combinations with no rationale.
A deck that radiates “made by AI” is not a deck a client should see.
But spending hours on slide production every time has become unbearable. There is too much else to do. The design judgments stay with us. The execution — translating those judgments into a file — should belong to the machine.
Resolving that contradiction is where the experiment began.
The First Wall: dom2pptx Hits Its Limit
Design the deck in HTML, then convert it directly to PowerPoint. In theory, this is the cleanest approach. A library called dom-to-pptx will turn the DOM into native PPTX shapes.
Reality refused to cooperate.
Change padding-left in CSS — the browser reflects it perfectly. The PPTX file size, however, does not shift by a single byte. Rounded corners disappear. Background colors drop. Flexbox children misalign.
No matter how many debug passes, the conversion engine is a black box that cannot be repaired from the outside.
It was demoralizing. The dream of HTML design flowing straight into PPTX, killed by a library’s constraints. Either give up here or find another route.
Letting Go of “One Tool to Rule Them All”
The framing changed. The mistake was trying to make a single tool carry the entire job.
dom2pptx hits 92% fidelity. The problem is the remaining 8% — corner radii, padding, font subtleties. So cover that 8% with a different mechanism.
A three-layer pipeline emerged.
- Layer 1: Design in HTML. Tailwind CSS plus Jinja2 templates. Every design decision is finalized inside the browser.
- Layer 2: Convert with dom2pptx. 92% fidelity translation into native PPTX shapes.
- Layer 3: Finish with python-pptx. At the XML level, force fonts, restore corner radii, correct positions. Pick up everything dom2pptx dropped.
Not one perfect tool. Three imperfect tools, coordinated. “Whatever the previous layer drops, the next layer catches” turned out to be the most resilient design philosophy.
Don’t Pick a Template. Pick a World.
Once the pipeline was running, the next problem appeared. Variation.
PowerPoint templates only differ in surface variables — change the color, change the font. The real difference between designs sits much deeper. Typographic density. The handling of whitespace. The radius of rounded corners. The diffusion of shadows. These elements move in concert and form a “world.”
Twenty websites were measured: Stripe, Apple, Figma, Hermès, Duolingo. Each was distilled into CSS variables — color, spacing, radii, shadows.
From those measurements, eight styles were defined.
| Style | World | Reference |
|---|---|---|
| corporate | Trust and structure | Stripe / Linear |
| minimal | Whitespace as voice | Apple Keynote |
| creative | Playful | Dribbble / Behance |
| dark | Dark and refined | Figma / Apple Pro |
| warm | Approachable | Duolingo / Slack |
| luxury | Premium | Hermès / Patek Philippe |
The color does not change. The structure changes.
For corporate, whitespace is generous, corners sit at 8px, shadows stay restrained. For luxury, whitespace expands further, corners drop to 0px, and a serif voice carries the page quietly. For warm, corners go to 16px, the palette softens, the icons turn rounder.
“Read the audience and match the design.” Twenty years of that reflex, translated into a bundle of CSS variables.
”Give Me an Icon for ‘Growth’” — In One Line
When building slides, icons and images quietly eat the most time.
You want an icon for “growth.” Open an icon site. Search. Download. Place. Resize. Two or three minutes per icon. Ten slides and you have lost half an hour.
In this pipeline, it is one line.
resolve_icon("growth", "creative")
# → "ph:trend-up-bold"Thirty-nine abstract concepts (growth, security, team, analytics, cost reduction, and more) are mapped across four icon sets. Choosing the style fixes the icon set as well. Corporate gets thin-line Lucide. Creative gets bold Phosphor.
Images follow the same logic. Each style carries an “image recipe.” Cover slides generate abstract patterns through Gemini. Content photos pull from Unsplash. If the API key is missing, it falls back to a placeholder. A four-layer structure. Images never go missing.
The only thing left to think about is what to communicate. The look is decided by the pipeline.
The Whole Time, It Was Trial and Error
To be honest: this broke many times before it worked.
dom2pptx mangled fonts, so a normalization step was added to push Noto Sans JP through to Meiryo at the DOM level. A bug that scaled font sizes by 1.25x was hunted down. A CSS-not-applied issue was investigated three separate times before being routed around in post-processing.
There were sessions where eight design styles were extracted into CSS variables in a single afternoon. There were also days where debugging consumed the entire day and not a single line of code was written.
But there was a moment when the “made by AI” smell finally lifted.
Open the preview HTML. Real Unsplash photographs. Real Iconify icons. The corporate-style proposal deck looking indistinguishable from one built by hand.
This one can go in front of a client.
What 14,600 Lines Mean
The pipeline runs to 14,600 lines. Forty-two files in Python and JavaScript. Fifteen slide layout patterns. Eight design styles. Thirty-nine concept-to-icon mappings. A four-layer image fallback.
But the substance of this pipeline is not “a tool that produces PPTX.”
It is the codification of “design decisions made to communicate with the audience.” The input is structured data. The output is a PPTX. From the same input, an HTML preview or a PDF can also be produced — because the design system lives in CSS.
We wanted to tell AI, “make the slides.” But the bar was unreasonably high, and the existing tools could not clear it. So we built our own.
Twenty years of aesthetic judgment, compiled into 14,600 lines of code. For now, it has reached a level that holds up in real work.