revealjs
Revealjs generates polished HTML presentations powered by reveal.js, letting you build slides with custom color palettes, multi-column layouts, code highlighting, and animations. The skill handles design strategy upfront—analyzing your content to inform color and layout choices—then scaffolds your presentation with a script and CSS variables for easy customization. Open the output HTML in any browser; no build step required.
Revealjs generates polished HTML presentations with custom themes, layouts, and animations—no build step needed.
AI-generated summary based on this skill's SKILL.md
Install
ryanbbrown/revealjs-skill/revealjs · repository language: JavaScript
git clone https://github.com/ryanbbrown/revealjs-skill
cp -r revealjs-skill/skills/revealjs ~/.claude/skills/revealjsFrequently asked questions
AI-generated answers based on this skill's SKILL.md and metadata
How do I make slides in HTML with revealjs?
Revealjs generates complete HTML presentations you can open directly in your browser. The skill creates a scaffold with reveal.js, custom CSS variables for your color palette, and multi-column layouts. You edit the HTML file to add your content, then open it in any browser—no build step, npm, or webpack needed.
Can revealjs create a presentation with custom themes and animations?
Yes. Revealjs analyzes your content upfront to inform design choices, then generates slides with a custom color palette, animations, and transitions built in. You control styling through CSS variables, and the skill scaffolds everything so you can customize themes and visual hierarchy without touching complex configuration.
Does revealjs support code highlighting and speaker notes?
Revealjs builds presentations with code highlighting and speaker notes built into the HTML structure. Multi-column layouts let you organize code samples alongside explanations, and the reveal.js framework handles syntax highlighting automatically. Speaker notes stay hidden during presentation mode but visible to you.
What license does revealjs use?
Revealjs is released under the MIT license, allowing you to use, modify, and distribute presentations freely for personal and commercial projects.
How quickly can I build a professional slideshow deck with revealjs?
Revealjs scaffolds your entire presentation structure in one pass, so you can build a polished deck quickly. The skill handles design strategy and layout upfront, leaving you to focus on content. Open the generated HTML file immediately—no compilation or build process delays your workflow.
SKILL.md
rendered from the published skill — quoted content, verbatim
Reveal.js Presentations
Create HTML presentations using reveal.js. No build step required - just open the HTML in a browser.
What You Create
A reveal.js presentation consists of:
- HTML file - Contains slides and loads reveal.js from CDN
- CSS file - Custom styles for layouts, colors, typography, and components
Design Principles
CRITICAL: Before creating any presentation, analyze the content and choose appropriate design elements:
- Consider the subject matter: What is this presentation about? What tone, industry, or mood does it suggest?
- Check for branding: If the user mentions a company/organization, consider their brand colors and identity
- Match palette to content: Select colors that reflect the subject
- State your approach: Explain your design choices before writing code
Requirements: - ✅ State
(truncated - see the full file via the links below)
Read as markdown · JSON record · Browse the source repository
File tree — 8 files
skills/revealjs/SKILL.md
skills/revealjs/references/advanced-features.md
skills/revealjs/references/base-styles.css
skills/revealjs/references/charts.md
skills/revealjs/scripts/check-charts.js
skills/revealjs/scripts/check-overflow.js
skills/revealjs/scripts/create-presentation.js
skills/revealjs/scripts/edit-html.js