skills.rest
Mathews-Tom
Mathews-TomCOMMUNITY
Explore all skills by this author →
𝕏@tom_mathewsGitHub

html-presentation

Convert documents, outlines, or markdown into self-contained HTML slide presentations.

310|45|Updated Feb 22, 2026
Search Tags:#html#presentation#theme#slides#responsive#export#reveal.js
One-click install
npx skills add https://github.com/Mathews-Tom/praxis-skills --skill html-presentation
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: html-presentation
Source: https://github.com/Mathews-Tom/praxis-skills/tree/main/skills/html-presentation
Command: npx skills add https://github.com/Mathews-Tom/praxis-skills --skill html-presentation

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve?

Convert documents, outlines, or freeform notes into polished, self-contained HTML slide presentations so users can present from a browser without needing PowerPoint or complex tooling. This removes manual slide layout work, ensures consistent visual themes, and provides keyboard/scroll navigation and responsive rendering out of the box.

Core Features & Use Cases

  • Automatic Slide Mapping: Identify logical sections, lists, metrics, quotes, workflows, and convert them into appropriate slide layouts (title, split, grid, metrics, timeline, quote, workflow, comparison, CTA).
  • Two Navigation Modes & Multiple Themes: Support horizontal Reveal.js decks or vertical scroll presentations with theme options (dark-editorial, light-minimal, corporate, hacker) and responsive CSS for three breakpoints.
  • Single-File Output & Accessibility: Produce a single self-contained HTML file with inline styles/scripts (optionally using Reveal.js CDN), keyboard navigation, fragment animations, slide numbers, and progressive reveal behavior for large decks.
  • Templates & References: Uses templates, theme variables, and navigation snippets to ensure consistent design and predictable initialization across slides.

Quick Start

Create a self-contained HTML presentation from the attached document using the dark-editorial theme and horizontal navigation, and save the output as presentation.html.

Frequently Asked Questions about html-presentation

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

FAQPage Schema
How do I convert markdown or text notes into a browser-ready HTML presentation?▼

To convert markdown into an HTML presentation, the Skill maps logical sections, lists, and quotes into appropriate slide layouts. It produces a self-contained single-file HTML deck with inline styles, scripts, and keyboard navigation.

Can I create Reveal.js slides directly from a markdown document?▼

Yes, you can create Reveal.js slides from markdown by selecting horizontal navigation mode. The Skill generates a single-file HTML deck using the Reveal.js CDN, complete with themes, fragment animations, and responsive CSS breakpoints.

Do I need PowerPoint to present HTML slides generated from my outline?▼

No, you do not need PowerPoint to present HTML slides. The Skill outputs a self-contained HTML file with inline styles and scripts, allowing you to present directly from any browser without external software dependencies.

What is the best way to build a responsive slide deck with vertical scroll navigation?▼

The best way to build a responsive scroll deck is selecting the vertical navigation mode during generation. The Skill applies responsive CSS across three breakpoints and includes themes like dark-editorial or light-minimal for optimal viewing.

Does the HTML presentation output support multiple visual themes?▼

Yes, the HTML presentation output supports multiple visual themes including dark-editorial, light-minimal, corporate, and hacker. Each theme provides consistent visual styling applied through templates and theme variables across all slides.

What are the limitations of using a single-file HTML format for large slide decks?▼

For large slide decks, a single-file HTML format relies on inline styles and scripts which can increase file size, but the Skill mitigates this with progressive reveal behavior and fragment animations to maintain smooth browser performance.

Related Skills

Explore More Content & Communication Skills→
eatbreadseatbreads
1

ppt-maker

Convert notes and outlines into editable PowerPoint decks with speaker notes.

Community
Intermediate
neubigneubig
3

openhands-slides

Create branded reveal.js slide decks as self-contained HTML files.

Community
Intermediate
jaballerjaballer

react-styling

Implements design tokens, responsive layouts, and CSS animations for React applications.

Community
Advanced
CDO-07-NewCDO-07-New

frontend-slides

Create browser-based presentation decks from notes or PowerPoint files.

Official
Advanced