frontend-slides
Frontend Slides transforms PowerPoint files into browser-native HTML presentations or builds custom decks from the ground up. Every slide maintains a fixed 16:9 stage with animation-rich styling, distinctive typography, and cohesive color schemes—all delivered as lightweight, dependency-free HTML files.
Frontend Slides converts PowerPoint presentations into animated, browser-based HTML slides with custom design.
AI-generated summary based on this skill's SKILL.md
Install
zarazhangrui/frontend-slides/frontend-slides · repository language: JavaScript
git clone https://github.com/zarazhangrui/frontend-slides
cp -r frontend-slides ~/.claude/skills/frontend-slidesFrequently asked questions
AI-generated answers based on this skill's SKILL.md and metadata
Can frontend-slides convert PowerPoint to web slides?
Frontend Slides transforms PowerPoint files into browser-native HTML presentations. Your PPTX converts to a lightweight, dependency-free HTML file that runs directly in any modern browser without requiring additional software or plugins.
How do I create an HTML presentation from scratch with frontend-slides?
Frontend Slides lets you build custom decks from the ground up with animation-rich styling, distinctive typography, and cohesive color schemes. Every slide maintains a fixed 16:9 stage, and you can apply interactive style previews to discover and refine your visual design before finalizing.
Does frontend-slides require dependencies to run?
No. Frontend Slides generates zero-dependency, self-contained HTML slide files. Each presentation is a standalone file that runs directly in your browser without needing Node, frameworks, or external libraries—making sharing and presenting effortless.
What makes frontend-slides good for pitch decks?
Frontend Slides specializes in building professional pitch or talk decks with distinctive aesthetics and animation-rich presentations. You get custom design control, beautiful CSS animations, and a polished 16:9 layout that helps your message stand out.
Can I preview different visual styles before finalizing?
Yes. Frontend Slides includes interactive style previews so you can discover and apply visual design choices in real time. Test color schemes, typography, and animations before committing to your final presentation aesthetic.
Is frontend-slides open source?
Frontend Slides is released under the MIT license, making it free to use, modify, and distribute for both personal and commercial projects.
SKILL.md
rendered from the published skill — quoted content, verbatim
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
(truncated - see the full file via the links below)
Read as markdown · JSON record · Browse the source repository
File tree — 15 files
.claude-plugin/marketplace.json
.gitignore
LICENSE
README.md
SKILL.md
STYLE_PRESETS.md
animation-patterns.md
bold-template-pack/README.md
bold-template-pack/deck-stage.js
bold-template-pack/selection-index.json
bold-template-pack/templates/8-bit-orbit/design.md
bold-template-pack/templates/8-bit-orbit/preview.md
bold-template-pack/templates/biennale-yellow/design.md
bold-template-pack/templates/biennale-yellow/preview.md
bold-template-pack/templates/block-frame/design.md