Can I convert my existing PowerPoint files into web slides?

Yes, the skill can use the python-pptx library to extract text, images, and speaker notes from .pptx files and transform them into a responsive HTML presentation.

Does this skill require external libraries like Reveal.js?

No, Frontend Slides defaults to zero-dependency, self-contained HTML files with inline CSS and JS for maximum performance, portability, and ease of deployment.

How does it ensure slides look good on different screen sizes?

It enforces a strict 'Viewport Fit' rule using CSS clamp() for scaling and hard height constraints, ensuring every slide fits perfectly within the screen without internal scrollbars.

What navigation controls are included in the generated decks?

Generated presentations include a built-in controller class that supports keyboard arrows, mouse wheel scrolling, and touch/swipe gestures for seamless delivery.

Frontend Slides

Name: Frontend Slides
Author: affaan-m

byaffaan-m

•

112,917

•

デザインツール

Generates high-performance, animation-rich HTML presentations with zero dependencies and automatic PowerPoint conversion capabilities.

Frontend Slides is a specialized Claude Code skill designed to build professional-grade, browser-based presentations that prioritize visual impact and technical performance. It enables users to create distinctive slide decks featuring fluid animations, responsive layouts, and viewport-safe typography without the need for external libraries or frameworks. Whether starting from a rough topic draft, enhancing existing HTML slides, or converting legacy .pptx files via automated Python extraction, the skill enforces rigorous design standards such as mandatory viewport fitting and reduced-motion support, ensuring a polished, production-ready result for pitches, conference talks, or internal workshops.

主な機能

01112,917 GitHub stars

02Mandatory viewport-fit enforcement to eliminate internal slide scrolling

03Built-in controller for keyboard, touch, and scroll-based navigation

04Visual exploration mode with interactive style previews for non-designers

05Automated PowerPoint (.pptx) to HTML conversion using Python extraction

06Zero-dependency, self-contained HTML/CSS/JS presentation generation

ユースケース

01Converting a corporate PowerPoint deck into a modern, web-based pitch presentation

02Rapidly prototyping multiple visual styles and typography for a new talk draft

03Creating high-fidelity, animation-heavy slides for a technical conference or workshop

What are Skills?·How to Install

Install with 🐟 Skill.Fish

npx skillfish add affaan-m/everything-claude-code frontend-slides

For use in Claude.ai and ChatGPT

主な機能

01112,917 GitHub stars

02Mandatory viewport-fit enforcement to eliminate internal slide scrolling

03Built-in controller for keyboard, touch, and scroll-based navigation

04Visual exploration mode with interactive style previews for non-designers

05Automated PowerPoint (.pptx) to HTML conversion using Python extraction

06Zero-dependency, self-contained HTML/CSS/JS presentation generation

ユースケース

01Converting a corporate PowerPoint deck into a modern, web-based pitch presentation

02Rapidly prototyping multiple visual styles and typography for a new talk draft

03Creating high-fidelity, animation-heavy slides for a technical conference or workshop