| name | frontend-slides |
| description | Create stunning, animation-rich single-file HTML presentations from scratch or by converting a PowerPoint (.pptx) file. Use when the user wants to build a presentation, convert a PPT to web format, or create slides for a talk, pitch, or demo. Shows 3 visual style previews before building the full deck — no design experience needed. |
Frontend Slides
Create zero-dependency, animation-rich HTML presentations that run entirely in the browser.
Core Principles
- Zero Dependencies — Single HTML files with inline CSS/JS. No npm, no build tools.
- Show, Don't Tell — Generate 3 visual previews before building. People discover what they want by seeing options, not describing them.
- Distinctive Design — No generic slides. Every presentation must feel custom-crafted.
- Viewport Fitting (NON-NEGOTIABLE) — Every slide MUST fit exactly within 100vh. No scrolling within slides ever. Content overflows? Split into multiple slides.
Workflow
Phase 1 — Gather Content
Ask the user:
- "What's the topic and goal? (e.g. investor pitch, product demo, teaching a concept)"
- "Who is the audience?"
- "How many slides roughly?"
- "Paste your content, bullets, or outline — OR share a .pptx file path to convert."
If a .pptx file is provided → jump to Phase 4 (PowerPoint Conversion) first, then return here.
Phase 2 — Style Selection (Always Do This)
Ask the user their vibe (multiselect, max 2):
- Impressed / Confident
- Excited / Energized
- Calm / Focused
- Inspired / Moved
Map their vibe to 3 distinct presets from this list and generate one single-slide HTML preview for each:
