html-ppt-taste-editorial

name html-ppt-taste-editorial description 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`. 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 project deck convention: each .slide is a 100vw × 100vh section, the active slide carries .active / .is-active , and the baked example owns keyboard, wheel, touch, and dot navigation inside the gallery iframe. No-script and print fallbacks keep every slide visible. 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 Runtime navigation: keyboard, wheel / trackpad, touch swipe, and dot buttons must all update the same active slide state. Keep the fade at roughly 400ms cubic-bezier(0.16, 1, 0.3, 1) . Static / print fallback: keep every slide visible when the runtime has not booted or the document is printed. No translate, no blur, no auto-advance. Pre-flight Substrate is warm off-white; foreground is off-black; never pure black/white Serif used on titles, grotesque on body, mono on meta — three families, three jobs One accent color, used at most three times in the whole deck Every slide has eyebrow + section number + page number At least one hairline-grid table or comparison module No drop shadows, no gradients, no emojis, no banned fonts Keyboard, wheel / trackpad, touch swipe, and dot navigation all move one slide and keep the active dot / active slide in sync