HTML PPT — Editorial Minimalism
A 16:9 deck for the briefs that hate neon: investor updates, design reviews, internal manifestos, lecture decks. Reads like a print supplement, not a SaaS landing.
Source
Distilled from Leonxlnx/taste-skill — skills/minimalist-skill/SKILL.md. The deck system follows the existing project convention from skills/html-ppt-pitch-deck/example.html (each .slide is a 100vw × 100vh section; opened directly, slides stack vertically). See example.html in this directory.
Hard rules
- Substrate: warm off-white
#FBFBFA / #F7F6F3. Foreground off-black #1A1A19. Never pure white or pure black.
- Type pairing: display in serif (Instrument Serif / Newsreader / Lyon), body in grotesque (Inter Tight / Switzer), meta in mono (JetBrains Mono).
- Display scale per slide: title
clamp(56px, 6.5vw, 96px) italic-capable serif, line-height 1.05, tracking -0.025em.
- Hairline only:
1px solid #EAEAEA — borders, dividers, table cells. No drop shadows.
- One accent color chosen from the muted-pastel pairs (e.g. sage
#346538 on #EDF3EC, or red #9F2F2D on #FDEBEC). Used sparingly — eyebrow dot, chart fill, call-out chip. Never as a slide background.
- Slide padding: generous (
72px 96px minimum). Title at most 14ch wide.
- Eyebrow: every slide opens with a mono uppercase eyebrow
letter-spacing: 0.18em and a section number 01 / 09.
- Page numbers: mono, bottom-right corner.
Banned
- Inter (use Inter Tight if you must, but prefer Switzer / SF Pro). No Roboto, Open Sans.
- Heavy drop shadows. Glow. Gradient text.
- 3-equal-card feature rows. Use uneven hairline-divided columns instead.
- Emojis in text or as bullet markers — use
— or no marker.
- Full-bleed photography on every slide. Use one or two image slides; reserve them.
- AI-cliché copy ("Elevate", "Unleash", "Seamless", "Next-Gen").
- Slide transitions noisier than fade-in.
Required slide archetypes (10–12 total recommended)
- Cover — serif title, italic mid-sentence accent, mono meta footer.
- Eyebrow + thesis — single sentence of body lede on the left; mono numbered TOC on the right.
- Numbered manifesto — three or four hairline-separated theses.
- Bento data slide — uneven 6-col grid with hairline gaps; one stat in serif, supporting in mono.
- Quote / pull-out — single sentence at large serif, attribution mono, hairline above and below.
- Comparison — two columns separated by a vertical hairline; "Doesn't / Does" or "Before / After".
- Table or index —
display: grid; gap: 1px on hairline color.
- Chart or breakdown — flat horizontal bar chart with mono labels, accent fill only on the latest bar.
- Team / colophon — mono key-value list, no avatars.
- Closing — serif final line italic; CTA as ghost button; signature in mono.
Motion
- Static-preview fallback: keep every slide visible (already wired by the deck base). When run as a real deck, fade-in at
400ms cubic-bezier(0.16, 1, 0.3, 1) is plenty.
- No translate, no blur, no auto-advance.
Pre-flight
1---2name: html-ppt-taste-editorial3description: 16:9 HTML deck in editorial-minimalist taste. Warm cream slides, serif display + grotesque body, hairline rules, monospace meta, generous macro-whitespace, one accent. Distilled from Leonxlnx/taste-skill `minimalist-skill`.4---56# HTML PPT — Editorial Minimalism78A 16:9 deck for the briefs that hate neon: investor updates, design reviews, internal manifestos, lecture decks. Reads like a print supplement, not a SaaS landing.910## Source1112Distilled from [Leonxlnx/taste-skill](https://github.com/Leonxlnx/taste-skill) — `skills/minimalist-skill/SKILL.md`. The deck system follows the existing project convention from `skills/html-ppt-pitch-deck/example.html` (each `.slide` is a `100vw × 100vh` section; opened directly, slides stack vertically). See `example.html` in this directory.1314## Hard rules1516- **Substrate:** warm off-white `#FBFBFA` / `#F7F6F3`. Foreground off-black `#1A1A19`. Never pure white or pure black.17- **Type pairing:** display in **serif** (Instrument Serif / Newsreader / Lyon), body in **grotesque** (Inter Tight / Switzer), meta in **mono** (JetBrains Mono).18- **Display scale per slide:** title `clamp(56px, 6.5vw, 96px)` italic-capable serif, line-height `1.05`, tracking `-0.025em`.19- **Hairline only:** `1px solid #EAEAEA` — borders, dividers, table cells. No drop shadows.20- **One accent color** chosen from the muted-pastel pairs (e.g. sage `#346538` on `#EDF3EC`, or red `#9F2F2D` on `#FDEBEC`). Used sparingly — eyebrow dot, chart fill, call-out chip. Never as a slide background.21- **Slide padding:** generous (`72px 96px` minimum). Title at most 14ch wide.22- **Eyebrow:** every slide opens with a mono uppercase eyebrow `letter-spacing: 0.18em` and a section number `01 / 09`.23- **Page numbers:** mono, bottom-right corner.2425## Banned2627- Inter (use Inter *Tight* if you must, but prefer Switzer / SF Pro). No Roboto, Open Sans.28- Heavy drop shadows. Glow. Gradient text.29- 3-equal-card feature rows. Use uneven hairline-divided columns instead.30- Emojis in text or as bullet markers — use `—` or no marker.31- Full-bleed photography on every slide. Use one or two image slides; reserve them.32- AI-cliché copy ("Elevate", "Unleash", "Seamless", "Next-Gen").33- Slide transitions noisier than fade-in.3435## Required slide archetypes (10–12 total recommended)36371. **Cover** — serif title, italic mid-sentence accent, mono meta footer.382. **Eyebrow + thesis** — single sentence of body lede on the left; mono numbered TOC on the right.393. **Numbered manifesto** — three or four hairline-separated theses.404. **Bento data slide** — uneven 6-col grid with hairline gaps; one stat in serif, supporting in mono.415. **Quote / pull-out** — single sentence at large serif, attribution mono, hairline above and below.426. **Comparison** — two columns separated by a vertical hairline; "Doesn't / Does" or "Before / After".437. **Table or index** — `display: grid; gap: 1px` on hairline color.448. **Chart or breakdown** — flat horizontal bar chart with mono labels, accent fill only on the latest bar.459. **Team / colophon** — mono key-value list, no avatars.4610. **Closing** — serif final line italic; CTA as ghost button; signature in mono.4748## Motion4950- Static-preview fallback: keep every slide visible (already wired by the deck base). When run as a real deck, fade-in at `400ms cubic-bezier(0.16, 1, 0.3, 1)` is plenty.51- No translate, no blur, no auto-advance.5253## Pre-flight5455- [ ] Substrate is warm off-white; foreground is off-black; never pure black/white56- [ ] Serif used on titles, grotesque on body, mono on meta — three families, three jobs57- [ ] One accent color, used at most three times in the whole deck58- [ ] Every slide has eyebrow + section number + page number59- [ ] At least one hairline-grid table or comparison module60- [ ] No drop shadows, no gradients, no emojis, no banned fonts