frontend-slides

Create zero-dependency HTML slide decks with viewport-fitted, responsive typography.

27.2k|2.2k|Updated Jan 28, 2026

Ready to run

npx skills add https://github.com/zarazhangrui/frontend-slides --skill frontend-slides-zarazhangrui

💬 Prompt for ChatGPT / Claude Chat▼

Please help me install this Agent Skill.
Skill: frontend-slides
Source: https://github.com/zarazhangrui/frontend-slides/tree/main
Command: npx skills add https://github.com/zarazhangrui/frontend-slides --skill frontend-slides-zarazhangrui

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

This skill helps non-designers craft production-ready, animation-rich HTML presentations with zero dependencies, enabling quick, portable slide decks.

Core Features & Use Cases

Zero dependencies — Deliver self-contained HTML slides with inline CSS/JS, no build tools.
Visual discovery workflow — Generate and compare three style previews to reveal preferred aesthetics without describing design taste.
PPT/PPTX conversion — Convert existing slides into web presentations, preserving content and assets for easy sharing.
Production-grade output — Fully accessible, responsive, and ready for distribution.

Quick Start

Provide a topic or PPTX to start; the skill will generate a viewport-fitted HTML deck or convert your slides into a web slideshow.

Frequently Asked Questions about frontend-slides

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

FAQPage Schema

How do I create HTML slides without dependencies or build tools?▼

To create HTML slides without dependencies, provide a topic or PPTX file and the skill generates a self-contained HTML deck with inline CSS/JS, requiring no external libraries or build tools.

Can I convert PPTX to a web presentation without losing content?▼

Yes, you can convert PPTX to a web presentation. The skill transforms existing slides into web slideshows while preserving content and assets for easy browser-based sharing.

What is the best way to ensure HTML presentations fit different screen sizes?▼

The best way to ensure HTML presentations fit different screen sizes is using viewport-fitted slides with clamp-based responsive typography. The skill enforces this automatically for accessible markup.

Do I need design experience to generate visually appealing web slide decks?▼

No design experience is needed to generate visually appealing web slide decks. The skill uses a visual discovery workflow, generating three style previews to reveal preferred aesthetics without requiring design input.

Are self-contained HTML slide decks accessible and production-ready?▼

Self-contained HTML slide decks are fully accessible and production-ready. The skill enforces accessible markup, responsive typography, and a portable structure ready for immediate distribution.

What are the limitations of zero-dependency HTML presentations?▼

Zero-dependency HTML presentations are limited to browser-based viewing environments and rely entirely on inline CSS/JS for animations, meaning they do not support server-side rendering or external framework integrations.