frontend-slides
Frontend Slides Skill
Generate browser-based HTML presentations as a single self-contained .html file. Three entry paths: new build from topic/notes, PPTX-to-HTML conversion, or enhancement of an existing HTML deck.
Routing disambiguation: When the user says only "slides" or "deck" without specifying format, ask exactly one question before proceeding: "Should this be an HTML file (opens in browser) or a PowerPoint file (.pptx)?" Route to pptx-generator for PowerPoint/Keynote/Google Slides requests.
Reference Loading Table
| Signal | Load These Files | Why |
|---|---|---|
| Phase 3 (style selection) or Phase 4 (build) | references/STYLE_PRESETS.md |
CSS base block, 12 named presets, mood mapping, density limits, validation breakpoints |
| SlideController, keyboard nav, touch swipe, wheel scroll, Intersection Observer, reveal animation | references/slide-controller.md |
Canonical JS implementation, navigating guard, wheel debounce, IO reveal pattern, anti-patterns with detection commands |
PPTX, .pptx, python-pptx, convert slides, extract slides |
references/pptx-conversion.md |
Safe extraction loop, notes guard, GROUP shape recursion, base64 image embedding, error-fix mappings |
Instructions
Phase 1: DETECT
Identify which of the three paths applies:
More from notque/claude-code-toolkit
generate-claudemd
Generate project-specific CLAUDE.md from repo analysis.
12fish-shell-config
Fish shell configuration and PATH management.
12pptx-generator
PPTX presentation generation with visual QA: slides, pitch decks.
12codebase-overview
Systematic codebase exploration and architecture mapping.
10image-to-video
FFmpeg-based video creation from image and audio.
9data-analysis
Decision-first data analysis with statistical rigor gates.
9