tooyoung:frontend-slides

Generate single-file HTML slide presentations with viewport-fitted, responsive slides.

17|4|Updated Jan 25, 2026
One-click install
npx skills add https://github.com/shiqkuangsan/oh-my-daily-skills --skill tooyoung-frontend-slides
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: tooyoung:frontend-slides
Source: https://github.com/shiqkuangsan/oh-my-daily-skills/tree/main/skills/frontend-slides
Command: npx skills add https://github.com/shiqkuangsan/oh-my-daily-skills --skill tooyoung-frontend-slides

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve?

This Skill automates the creation of single-file HTML slide presentations that perfectly fit any viewport, eliminating the need for complex build tools or frameworks.

Core Features & Use Cases

  • Viewport-Fitting Slides: Ensures each slide occupies exactly one screen, with content scaling via clamp().
  • Single-File Output: Generates one .html file with all CSS, JS, and content inline.
  • Theme Variety: Offers 8 curated themes (dark, light, specialty) with font fallbacks.
  • Use Case: Quickly generate a pitch deck for a new feature, a product demo, or a technical explanation, all within a single, shareable HTML file.

Quick Start

Use the frontend-slides skill to create a presentation about the new AI features with the 'Neon Cyber' theme.

Frequently Asked Questions about tooyoung:frontend-slides

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

FAQPage Schema
How do I generate HTML slides that automatically fit any screen size?

Generate single-file HTML slides that are viewport-fitted and responsive using CSS clamp() for fluid typography and spacing. Each slide occupies exactly one screen, scaling content dynamically without complex build tools or frameworks.

Can I create a single-file HTML presentation without external CSS or JavaScript dependencies?

Yes, you can create a single-file HTML presentation with all CSS, JS, and content inline. This approach eliminates external dependencies, producing one shareable .html file that works independently across different platforms and browsers.

What is the best way to build a responsive pitch deck using HTML and CSS?

The best way to build a responsive pitch deck is generating single-file HTML slides with fluid typography via CSS clamp(). This method supports 8 curated themes with system font fallbacks and includes accessibility features like reduced motion.

Does this HTML slide generator support multiple themes and accessibility features?

Yes, this HTML slide generator supports 8 curated themes including dark, light, and specialty options with system font fallbacks. It also includes accessibility features such as reduced motion to ensure presentations are inclusive and adaptable.

Are there content density limits when creating viewport-fitting HTML slides?

Yes, the HTML slide generator adheres to strict content density limits to ensure each slide perfectly fits the viewport. This constraint prevents overflow and maintains readability across screen sizes when scaling content via CSS clamp().