LANVAR
← The shelf

Echo

Escaped the lab

An accessible PDF reader that wraps every single word in its own element — so it can read aloud, highlight, and track your focus word by word.

Reactpdf.jsWeb Speech 2024
✳ How it actually works
PAGE 4 OF 12 · TEXT LAYER every word lives in its own <span> — the highlight just walks the list READ-ALOUD ENGINE STATUS SPEAKING PAGE TURN SPEAKING WORD BY WORD PAGE 4 / 12 → 5 one word, one pulse — the last word turns the page
FIG 1 · read-aloud, animated — the highlight walks word by word; the last word turns the page
PDF upload drop it in pdf.js render page → canvas text layer rebuild every word wrapped in its own <span> — words become addressable read aloud karaoke-style highlight, word by word cursor tracking follow your pointer eye tracking beta — follow your gaze floating toolbar zoom · pages · highlight colour · light/dark reading
FIG 2 · the machinery — PDF → canvas + word spans → aids on top
The story

Reading a dense PDF with a wandering brain is a fight. Echo renders PDFs in the browser and layers focus aids on top: read-aloud with karaoke-style highlighting, a cursor-tracking mode, and an experimental eye-tracking mode.

The technical move that makes it all possible: after pdf.js renders each page to canvas, Echo rebuilds the text layer and wraps every individual word in its own span. Suddenly words are addressable — highlightable, clickable, followable. A floating toolbar handles zoom, page navigation, highlight colours, and light/dark reading modes.

Accessibility features usually get bolted on last; Echo is what happens when they are the whole product.

GitHub ↗
Next on the shelf Royal Sounds →