A presenter toolkit for reveal.js — and a tiny tour of what reveal itself can do.
Move the mouse to the bottom-left corner — the toolbar appears.
Navigate with → / ←, or just tap the right/left half on touch.
Press A (or the pen button) and write right here.
E eraser (per stroke!) · Ctrl+Z undo · Ctrl+Shift+Z redo · X clear · Esc exit.
Pick colours and pen widths in the bar; drag it by its grip, minimize it,
park it anywhere. Ink survives reloads — and even editing the deck later.
Three neutrals + five hues, each as an ink (dark Tailwind 700 — for white slides) / chalk (light Tailwind 300 — for dark boards) pair.
*simulated: limited contrast, washed-out colours, room light falling on the wall. Even “black” only reaches mid-gray there — the chalk shades are what still read on a projected dark board.
Draw a circle, then switch the deck format:
The circle stays a circle — strokes remember their aspect ratio and are aspect-fit, not stretched. (Buttons also demo that taps on interactive elements never trigger slide navigation.)
reveal can nest slides — press ↓.
Great for optional detail: the audience path goes left-to-right, the deep-dives hide below.
Ink works on vertical slides too — every slide keeps its own drawings.
Reveal content step by step:
Each step is one arrow press — and each gets its own page in the PDF export.
Press → and watch the box…
Matching data-id elements animate between slides — no code.
LaTeX typesetting via the math plugin (KaTeX or MathJax):
\[ e^{i\pi} + 1 = 0 \qquad\qquad \int_{-\infty}^{\infty} e^{-x^2}\,dx = \sqrt{\pi} \]
Write LaTeX right in your HTML — inline math like \( a^2 + b^2 = c^2 \) works too. (And yes, you can draw on formulas.)
Reveal.initialize({
hash: true,
// walk through code line by line:
plugins: [ RevealHighlight, RevealAutohideToolbar ],
});
Arrow keys step through the highlighted lines.
Any slide can have a colour, gradient, image, video or iframe background — this one is a CSS gradient.
One file, no dependencies:
github.com/frankhuettner/reveal.js-autohide-toolbar
reveal.js basics: revealjs.com · this deck is the plugin's test subject — it runs in CI on Chromium & WebKit × reveal 5 & 6.