frontend-slides

Create viewport-fit HTML presentations with inline CSS and JavaScript.

41|5|Updated Sep 30, 2025
One-click install
npx skills add https://github.com/efekrbas/discord-hypesquad-manager --skill frontend-slides-efekrbas
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: frontend-slides
Source: https://github.com/efekrbas/discord-hypesquad-manager/tree/main/.agents/skills/frontend-slides
Command: npx skills add https://github.com/efekrbas/discord-hypesquad-manager --skill frontend-slides-efekrbas

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill requires python-pptx, and includes scripts (resource) components.

What problem does it solve?

This Skill removes the friction of building polished presentations by generating viewport-safe, animation-rich HTML slide decks from scratch or by converting existing PowerPoint files.

Core Features & Use Cases

  • New Presentation Creation: Turn a topic, outline, or rough notes into a complete browser-based slide deck with cohesive styling and smooth motion.
  • PPTX Conversion: Extract slide content, images, and speaker notes from PowerPoint files and rebuild them as a self-contained HTML presentation.
  • Design Variations: Explore curated visual presets so the deck can match different moods such as bold, editorial, calm, playful, or futuristic.
  • Viewport-First Layouts: Keep every slide fit-to-screen with responsive typography, strict spacing limits, and mobile-safe behavior.
  • Interactive Delivery: Add keyboard navigation, touch support, progress indicators, and optional inline editing for live browser customization.

Quick Start

Ask me to create or convert your presentation, share the topic or PPTX, and tell me the style and editing preferences you want.

Frequently Asked Questions about frontend-slides

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I convert a PowerPoint file to an HTML presentation?

You can convert PPTX files to HTML presentations by extracting slide content, images, and speaker notes to rebuild them as self-contained, browser-based slide decks. This process requires python-pptx to parse the original PowerPoint structure.

What is viewport-fitting in HTML slide decks?

Viewport-fitting ensures HTML slide decks fit exactly within the screen using clamp-based responsive sizing and strict overflow control. This approach keeps typography and spacing mobile-safe without requiring external layout dependencies.

Can I create a new HTML presentation from scratch using a topic outline?

You can create new HTML presentations from a topic, outline, or rough notes by generating cohesive styling and smooth animations. The resulting deck uses inline CSS and JavaScript for a zero-dependency, visually rich browser delivery.

Does the generated HTML slide deck support touch and keyboard navigation?

Generated HTML slide decks support interactive delivery through keyboard navigation, touch support, and progress indicators. They also include optional inline editing for live browser customization during presentation delivery.

What are the limitations of using python-pptx for PPTX conversion?

Using python-pptx for PPTX conversion focuses on extracting text, images, and speaker notes rather than preserving native PowerPoint animations or complex layout formatting. Complex visual elements are rebuilt as self-contained HTML with curated styles.