frontend-slides

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

27.2k|2.2k|Updated Jan 28, 2026
One-click install
npx skills add https://github.com/zarazhangrui/frontend-slides --skill frontend-slides-zarazhangrui
Or copy as Structured Prompt for Agent
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.

Related Skills