frontend-slides
Installation
SKILL.md
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 visual previews, not abstract choices. People discover what they want by seeing it.
- Distinctive Design — No generic "AI slop." Every presentation must feel custom-crafted.
- Progressive Disclosure — Read lightweight style indexes first. For bold templates, use small preview cards for style previews and load the full
design.mdonly after the user picks that template. - Fixed 16:9 Stage (NON-NEGOTIABLE) — Every deck uses a 1920×1080 slide canvas scaled as a whole to the viewport. Slides must stay 16:9 on every screen, including phones. Do not reflow slide content to fit the device.
Design Aesthetics
You tend to converge toward generic, "on distribution" outputs. In frontend design, this creates what users call the "AI slop" aesthetic. Avoid this: make creative, distinctive frontends that surprise and delight.
Focus on: