frontend-slides

Generate viewport-optimized HTML presentations from content or PowerPoint files.

Updated Jan 30, 2026

Search Tags:#design #html #presentation #animation #slides #web

Ready to run

npx skills add https://github.com/ThejanaJayalath/Niolla-PM-system --skill frontend-slides-thejanajayalath

💬 Prompt for ChatGPT / Claude Chat▼

Please help me install this Agent Skill.
Skill: frontend-slides
Source: https://github.com/ThejanaJayalath/Niolla-PM-system/tree/main/.cursor/.agents/skills/frontend-slides
Command: npx skills add https://github.com/ThejanaJayalath/Niolla-PM-system --skill frontend-slides-thejanajayalath

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes assets (resource) components.

What problem does it solve?

This skill solves the problem of creating engaging, high-quality presentations without relying on bloated, proprietary software or generic templates. It ensures every slide is perfectly optimized for the browser viewport.

Core Features & Use Cases

Zero-Dependency HTML Decks: Generate self-contained, animation-rich presentations that run in any browser.
PPT/PPTX Conversion: Seamlessly transform existing PowerPoint files into modern, web-based slide decks.
Visual Exploration: Use style presets to discover the perfect aesthetic for your pitch, workshop, or conference talk.

Quick Start

Use the frontend-slides skill to create a new pitch deck presentation based on the notes provided in my attached text file.

Frequently Asked Questions about frontend-slides

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

FAQPage Schema

How do I convert PowerPoint files to HTML presentations?▼

The skill converts existing PPT or PPTX files into self-contained, web-based HTML slide decks. These presentations are animation-rich and run in any browser without requiring proprietary software.

Can I create animation-rich slides from raw text content?▼

Yes, you can generate animation-rich HTML presentations directly from raw content. The output uses browser-native technologies like CSS custom properties and Intersection Observer to ensure high performance and viewport-optimized layouts.

Do I need any external dependencies to view these HTML slides?▼

No external dependencies are required. The skill generates zero-dependency HTML decks that are completely self-contained, ensuring your presentations run seamlessly in any standard web browser.

What is the best way to build a responsive pitch deck for the web?▼

The best way is to use style presets that enforce strict responsive layout constraints. This approach ensures every slide is perfectly optimized for the browser viewport across various devices and screen sizes.

Does this approach support different presentation design presets?▼

Yes, it supports diverse design presets tailored for pitch decks, workshops, and conference talks. You can use these visual style presets to discover the perfect aesthetic for your specific presentation context.

Why are my HTML slides not fitting the browser viewport properly?▼

Your HTML slides may not fit the viewport if strict responsive layout constraints are not applied. The skill enforces these constraints to ensure every slide is perfectly optimized for the browser viewport.