Create animation-rich HTML presentations from scratch or by converting PowerPoint files.
What it does
Claude generates HTML presentations that are technically a sequence of slides but look like unstyled divs — no transitions, no visual hierarchy between slides, no consistent layout, and no keyboard navigation. This skill loads the patterns for building animation-rich HTML presentations: CSS-based slide transitions, consistent typography and layout across slides, keyboard and touch navigation, speaker notes, and the ability to convert PowerPoint content into a web-based format that looks better than the original. Made by zarazhangrui.
Use case
Creating web-based presentations that can be opened in a browser rather than needing PowerPoint. Particularly useful for technical talks where code needs to be syntax-highlighted and interactive, or for presentations that will be shared as a URL.
"Build a presentation about this technical topic — 10 slides with code examples." "Convert this PowerPoint outline into an animated HTML slide deck." "Create a demo presentation with a live code editor embedded in one slide." "Build a presentation with a countdown timer and speaker notes." "Make these slides work offline as a standalone HTML file."
Describe the presentation: topic, number of slides, content for each, and any specific visual requirements.
For PowerPoint conversion: provide the outline or key points. Claude builds the HTML version.
Specify interactivity: code blocks, embedded demos, or interactive elements within slides.
Input
A presentation outline, PowerPoint content to convert, or a topic with key points to structure into slides.
Output
A complete HTML presentation with CSS transitions, keyboard navigation, consistent slide layouts, syntax-highlighted code blocks, and speaker notes. Runs in any browser without installation.
npx skillsadd zarazhangrui/skills/frontend-slides
Requires skills.sh CLI
Create beautiful visual art in .png and .pdf documents using design philosophy. You should use this skill when the user asks to create a poster, piece of art, design, or other static piece. Create original visual designs, never copying existing artists' work to avoid copyright violations.
Create, read, edit, and manipulate Word documents (.docx files) with formatting, tracked changes, and text extraction.
A set of resources to help me write all kinds of internal communications, using the formats that my company likes to use. Claude should use this skill whenever asked to write some sort of internal communications (status reports, leadership updates, 3P updates, company newsletters, FAQs, incident reports, project updates, etc.).