--- name: replit-deck description: | Single-file horizontal-swipe HTML deck in the style of Replit Slides's landing-page template gallery. Eight distinct themes (helix, holm, vance, bevel, world-dark, world-mint, atlas, bluehouse) — each a complete visual system (palette + type + accent) captured from replit.com/slides. Pick one theme, do not mix. For pitch decks, board reports, brand memos, campaign reveals — when the user explicitly wants "Replit Slides style". triggers: - "replit deck" - "replit slides" - "replit 风格 ppt" - "replit style deck" - "helix deck" - "holm memo" - "atlas chapter" - "bluehouse" - "bevel campaign" od: mode: deck scenario: product preview: type: html entry: index.html design_system: requires: false inputs: - name: theme type: enum required: true default: helix values: - helix # Modern minimal · light grey · ink + electric blue · SaaS metrics / board - holm # Editorial serif · cream · ink + deep chestnut · legal / finance memo - vance # Gallery · cream · cream serif on black bars · art catalog / showcase - bevel # Y2K editorial · black · display type + product photo grid · campaign - world-dark # Finance green dark · deep green · mint + neon yellow · policy report - world-mint # Finance green light · mint · deep green + neon yellow · policy report - atlas # Museum · black · serif + vermilion · long-form narrative / chapter deck - bluehouse # Consumer card · deep navy · gradient cards + peach → coral · product showcase - name: slide_count type: integer default: 6 min: 3 max: 20 # 6 is a board-update baseline. Memos and campaign decks usually land # at 3–4 (see example-holm / example-bluehouse). Long-form chapters # (atlas) can run 8–12. Don't pad to hit the default. --- # Replit Deck Skill Produce a single-file horizontal-swipe HTML deck in one of eight Replit-Slides themes. Every theme is a complete visual system — do not mix tokens across themes. ## Resource map ``` replit-deck/ ├── SKILL.md ← you're reading this ├── assets/ │ └── template.html ← seed: 8 themes via [data-theme=*], proven iframe-nav script (READ FIRST) ├── references/ │ ├── themes.md ← 8 themes: when-to-pick / do / don't / primary layouts │ ├── layouts.md ← 10 paste-ready slide layouts, cross-theme │ ├── components.md ← shared primitives (eyebrow, kpi-row, image-grid, meta-bar) │ └── checklist.md ← P0/P1/P2 self-review + theme lock-in gate └── examples/ ← four reference decks across the most contrasting themes ├── example-helix.html (SaaS board update · light minimal) ├── example-holm.html (legal fintech memo · cream editorial serif) ├── example-atlas.html (quarterly history chapter · black + vermilion) └── example-bluehouse.html (real estate ROI · navy + gradient cards) ``` ## Workflow ### Step 0 — Pre-flight (mandatory reads) 1. Read `assets/template.html` end-to-end. The `[data-theme]` blocks carry the tokens; the `