How to generate reveal.js slide deck from markdown
- Step 1Draft the talk in Markdown — Write your content top to bottom. Use a
## Headingto title each idea and standard Markdown for bullets, code fences, and tables. - Step 2Insert horizontal breaks — Put a line with only
---between each slide. Three dashes on their own line is the horizontal separator the tool splits on. - Step 3Add vertical stacks where useful — Where you want a drill-down (overview, then detail), separate those sub-slides with a line of only
----(four dashes). They become a vertical group under one section. - Step 4Load your file — Paste the Markdown or drop a single
.md/.markdownfile into the tool. Only one file is processed per run. - Step 5Preview the rendered deck — The result panel shows a live Reveal.js preview in an iframe. Toggle to raw HTML if you want to inspect the generated
<section>structure. - Step 6Download and present — Click Download to save
<yourfile>-slides.html, open it in a browser, and present. Use arrow keys to move and Esc for the slide overview.
Slide separator reference
The only two structural controls — both are whole-line markers the tool matches with a regex.
| Marker | Pattern matched | Effect | Reveal.js result |
|---|---|---|---|
--- | A line of only three dashes | Ends a slide, starts the next horizontal slide | New top-level <section> |
---- | A line of only four dashes | Splits a slide into a vertical stack | Nested <section> inside a parent <section> |
## heading | Markdown heading inside a slide | Renders as a title — does NOT create a new slide | <h2> within the current <section> |
| Blank line | Empty line | Normal Markdown paragraph break | Stays on the same slide |
Output and engine facts
What the converter emits and which library renders it.
| Property | Value |
|---|---|
| Output type | Self-contained HTML page (-slides.html) |
| Markdown engine | marked 14.1.4 (GFM defaults: tables, code fences, strikethrough) |
| Reveal.js version | 5.1.0, loaded from cdnjs (CDN required) |
| Theme | black (built-in Reveal.js theme, not configurable here) |
| Init call | Reveal.initialize({ hash: true }) |
| Files per run | One (this tool does not accept multiple files) |
Tier limits for the markdown family
Both a byte ceiling and a separate character-count limit apply per file.
| Tier | Max file size | Max characters | Files per run |
|---|---|---|---|
| Free | 1 MB | 500,000 | 1 |
| Pro | 10 MB | 5,000,000 | 10* |
| Pro + Media | 50 MB | 20,000,000 | 50* |
| Developer | 500 MB | Unlimited | Unlimited* |
Cookbook
Five conference-ready patterns. Every example shows real Markdown source and the slide structure it produces. Remember: only --- and ---- create slides — headings never do.
A minimal three-slide talk
Three horizontal slides separated by ---. The title slide, a point, and a closer.
# Scaling Postgres to 10k QPS A war story --- ## The problem - Connection storms at peak - p99 latency blew past 2s --- ## Thanks! Find the slides at example.com/talk
Vertical drill-down with `----`
One topic with two sub-slides stacked vertically. The audience presses Down to drill in.
## Caching strategy Three layers, one goal. ---- ### Layer 1: app cache In-process, 50ms TTL. ---- ### Layer 2: Redis Shared, 5s TTL.
Code-heavy slide
Fenced code blocks render as <pre><code>. There is no syntax-color highlighting — the deck shows plain monospaced code.
## The fix ```sql ALTER SYSTEM SET max_connections = 200; SELECT pg_reload_conf(); ``` --- ## Result p99 dropped to 180ms.
A data slide with a table
GFM pipe tables are supported by the engine and render on the slide.
## Before vs after | Metric | Before | After | |--------|--------|-------| | p99 | 2.1s | 180ms | | QPS | 3,000 | 10,400|
Generated output shape
What the converter wraps your content in (abridged). The black theme and CDN links are fixed.
<div class="reveal"><div class="slides">
<section>...slide 1...</section>
<section>
<section>...sub 1...</section>
<section>...sub 2...</section>
</section>
</div></div>
<script>Reveal.initialize({ hash: true });</script>Edge cases and what actually happens
Heading does not start a new slide
By designA ## heading is rendered as a title inside the current slide. It does NOT begin a new slide. To break, you must add a --- line. If your deck has one giant slide, you are missing separators.
YAML front matter at the top
CautionA leading --- ... --- front-matter block will be read as two separator lines, producing an empty first slide and a slide of bare key/value text. Remove front matter before converting, or expect those extra sections.
`---` used as a horizontal rule
CautionIn normal Markdown --- is a thematic break. Here it is always a slide separator, so a --- you meant as a divider will split the deck instead of drawing a line.
Deck requires internet to present
CautionReveal.js CSS and JS load from cdnjs. With no network the page renders as plain unstyled HTML, not a slideshow. For a venue with no Wi-Fi, test on the conference network first.
No syntax highlighting
ExpectedCode fences render as plain monospaced <pre><code>. The deck does not bundle highlight.js, so keywords are not colored. Keep code samples short and legible without color.
No speaker-notes transform
Not supportedThere is no Note: to <aside class="notes"> conversion in this tool. Text you intend as notes appears on the slide itself. Edit the HTML by hand if you need Reveal's presenter notes.
LaTeX / math is not rendered
Not supportedThe engine does not load KaTeX or MathJax. $E = mc^2$ shows as literal text. For consistent math delimiters in source, use md-math-normalizer first, but the slide will still show raw math.
File over the tier limit
413 rejectedOn Free, a Markdown file above 1 MB or 500,000 characters is rejected before conversion. The character limit is separate from the byte limit — a dense file can hit chars first. Upgrade or split the deck.
Multiple files dropped
IgnoredThis tool does not accept multiple files. If you select several, only the first is converted. Merge talks first with md-merger.
Empty input
ExpectedEmpty Markdown produces a valid Reveal.js page with one empty <section>. It is a working (blank) deck, not an error.
Frequently asked questions
How do I separate slides?
Put a line containing only --- between slides for a horizontal break, and a line containing only ---- (four dashes) for a vertical sub-slide break. Those are the only two markers the tool acts on.
Does each heading become its own slide?
No. Headings render as titles inside the current slide. Only --- and ---- create new slides. This differs from some Markdown-slide conventions, so add explicit separators.
What does the output file look like?
A single <yourfile>-slides.html page that links Reveal.js 5.1.0 stylesheets and script from cdnjs, wraps your content in <section> elements, and calls Reveal.initialize({ hash: true }).
Can I present without internet?
Not reliably. The Reveal.js assets load from a CDN. Offline, the page falls back to unstyled HTML. Test on the venue network beforehand, or self-host the assets by editing the HTML.
Is there syntax highlighting for code?
No. Fenced code blocks render as plain monospaced text. There is no highlight.js plugin in the generated deck.
Can I add speaker notes?
Not through this tool — there is no Note: conversion. Anything you write stays on the slide. To use Reveal's presenter notes, add <aside class="notes"> blocks to the HTML manually after download.
Which theme does the deck use?
The built-in Reveal.js black theme. There is no theme picker in this tool. You can swap the theme stylesheet link in the downloaded HTML.
Are tables and task lists supported?
Yes. The engine uses GitHub-Flavored Markdown defaults, so pipe tables, task lists, strikethrough, and autolinks render inside slides.
Does it render LaTeX math?
No. KaTeX and MathJax are not loaded, so math shows as literal text. Normalize your delimiters with md-math-normalizer if you plan to add a math library to the HTML yourself.
How big a deck can I convert?
Free allows 1 MB and 500,000 characters per file. Pro raises that to 10 MB / 5,000,000 chars, Pro + Media to 50 MB / 20,000,000, and Developer removes the character cap (500 MB file size).
Can I convert several talks at once?
No. This tool processes one file per run. Combine sources first with the md-merger tool, then convert the merged file.
What if I just want plain HTML, not slides?
Use md-to-html for a styled HTML page, or md-to-github-html for GitHub-style rendering. For a printable handout, md-to-pdf-modern converts the same Markdown to a PDF-ready page.
Privacy first
All Markdown processing runs locally in your browser using JavaScript. No file is ever uploaded to JAD Apps servers — only metadata counters are saved for signed-in dashboard stats.