$npx skillfedfor your agent

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

379 35 MITupdated by ryanbbrown

Decision gist · record as of 2026-05-02

Revealjs generates polished HTML presentations with custom themes, layouts, and animations—no build step needed. 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.

manual: git clone https://github.com/ryanbbrown/revealjs-skill → cp -r revealjs-skill/skills/revealjs ~/.claude/skills/revealjs
skills/revealjs/SKILL.md · version 96a16dae

Use it when

  • Yes.
  • Revealjs builds presentations with code highlighting and speaker notes built into the HTML structure.

Verify before relying

Read SKILL.md below before installing (8 files). Open directory: indexed for reading, not audited.

Same gist for agents: .md · .json

Install

ryanbbrown/revealjs-skill/revealjs · repository language: JavaScript

Open directory. Skills are indexed for reading, not audited. Review a skill's body before installing it.

Frequently 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:

  1. HTML file - Contains slides and loads reveal.js from CDN
  2. 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:

  1. Consider the subject matter: What is this presentation about? What tone, industry, or mood does it suggest?
  2. Check for branding: If the user mentions a company/organization, consider their brand colors and identity
  3. Match palette to content: Select colors that reflect the subject
  4. State your approach: Explain your design choices before writing code

Requirements: - ✅ State

(truncated - see the full file via the links below)

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

Let your AI agent find skills like this

Example. Real query, live index.

You found this page by searching. An agent finds it by wishing: SkillFed indexes 56,283 agent skills by what they can do, searchable in plain language.

wish › “Create a polished, professional presentation with custom themes and animations”

Give your agent the search over MCP, or paste the wish link into any chat. No install? Search from any chat →

Related skills

Revealjs Presenter
by jwynia · jwynia/agent-skills

Build polished slide decks in reveal.js with a single self-contained HTML file. The skill handles layout, typography, and visual structure through configurable themes and reusable components like bars, cards, and grids. Use it for pitch decks, technical talks, or educational presentations.

no license declared → metadata onlyupdated Feb 2026
★ 124repo stars
html-slides
by claude-office-skills · claude-office-skills/skills

HTML Slides generates reveal.js presentations with full control over themes, transitions, and interactivity. Supports animations, syntax highlighting, speaker notes, and responsive design for tech talks, product launches, and code walkthroughs.

MITupdated Jan 2026
★ 338repo stars
html-presentation
by Mathews-Tom · Mathews-Tom/armory

Transform any document, outline, or notes into a polished HTML slide deck ready to present in a browser. Choose between horizontal or vertical scroll navigation, pick from multiple visual themes, and customize layouts for your audience—all in a single, self-contained file.

MITupdated Jul 2026
★ 274repo stars
frontend-slides
by gooseworks-ai · gooseworks-ai/goose-skills

frontend-slides generates production-quality HTML presentations that run entirely in the browser with zero external dependencies. Convert PowerPoint files to web-ready decks or build new presentations from scratch, with visual exploration guiding design choices rather than abstract options. Note: This skill is deprecated in favor of goose-graphics, which offers expanded format support and additional styling presets.

MITupdated Jul 2026
★ 1,062repo stars
visualize
by careerhackeralex · careerhackeralex/visualize

Visualize transforms your concepts into polished, self-contained HTML visualizations in one go. Generate slide decks, dashboards, infographics, flowcharts, timelines, and other visual formats—each as a standalone file ready to open anywhere. Perfect for presenting information in ways that help audiences grasp it faster.

MITupdated Mar 2026
★ 180repo stars
Guizang Ppt Skill
by samhvw8 · samhvw8/dotfiles

Build browser-based presentation decks as self-contained HTML files with zero dependencies. Choose between a serif-driven Digital Magazine aesthetic with fluid shader backgrounds or a sans-serif Swiss International style with grid overlays and high-contrast functional colors. Both include horizontal swiping, Motion entrance animations, and 22+ tested layouts.

no license declared → metadata onlyupdated Jul 2026
★ 14repo stars

More skills Presentation Generator (unlicensed) · Presentations (unlicensed) · frontend-slides (MIT) · Instagram Carousel Tweet (unlicensed) · Add Feature (unlicensed)

Tags
slide-deck-builderhtml-presentationweb-based-slidewarespeaker-notestheme-customizationno-build-requiredanimation-supportcode-syntax-highlightresponsive-layouts