I built a PDF reader where every note remembers its page

Dikshant Raj — Mon, 28 Sep 2026 15:52:18 +0000

Every time I read a long PDF (a paper, a spec, a book chapter) ended up with the same mess: a list of highlights with no context, a notes file that didn't know where anything came from, and, when I pasted the PDF into an AI assistant, answers that ignored what I actually thought about it.

So I built Marginalia: a free, open-source PDF reader with a notes canvas next to it. It launched on Product Hunt today.

What it does
Pull a passage onto a canvas. Drag a box over any text (or a diagram) in the PDF and it lands on the canvas as a card.
Write your own note on it, and link cards together. Threads between cards can be labelled supports, contradicts, references, or anything you type.
Click any card to jump straight back to the exact spot in the PDF. Every excerpt remembers its document and page.
Copy for AI. One click turns the whole canvas into a single Markdown file: every excerpt, its page, your note, and how the ideas connect. Paste it into any AI assistant alongside the PDF and ask things like "Where is my argument thin?" or "Quiz me on this chapter."
There's no account and nothing is uploaded. PDFs and notes live in your browser (IndexedDB), and it works offline as a PWA.

Why a marquee instead of text selection
Selecting text in a PDF with the browser's native selection is painful on anything with columns or tables, because the underlying text order often doesn't match the visual order. Marginalia uses a drag-marquee instead: whatever lines sit inside the box you draw become the excerpt, clustered into rows by position, so tables come out in reading order. If there's no text layer at all (a scanned page), the same gesture captures an image excerpt instead.

The export format
The Markdown is designed to be read by a model, not just a person:

C1 · On-Reading-Slowly.pdf, p.1

A reader with a stack of index cards could lay out an argument
spatially, moving claims around a desk…

Note: Spatial thinking: this is exactly what the canvas is for.

Links:

supports → C2

Cards get stable IDs (C1, C2…), links are written in both directions, and image excerpts are embedded as data URIs in the downloaded file (and swapped for short placeholders in Copy for AI, so you don't paste megabytes of base64 into a chat box).

Stack
Deliberately boring: plain HTML, CSS and JavaScript, PDF.js for rendering, IndexedDB for storage, a service worker for offline use, and static hosting on Cloudflare. No framework and no build step. The whole thing is MIT licensed.

A few things that were harder than expected:

Pinch-to-zoom on long PDFs. Re-laying out 150 pages on every touch event made it stutter. The fix was to preview the zoom with a cheap CSS transform during the gesture and only commit the real zoom when your fingers lift, re-anchored to the page element under them so it doesn't drift.
Highlights wider than the text. PDF.js sizes text-layer spans with a CSS variable I wasn't setting, so every span fell back to 16px and highlights spilled past the end of the line. It's a one-line fix once you find it.
Dragging cards on a tablet when the finger lands on text. Deciding between "scroll this long quote" and "drag this card" needed a small gesture classifier: wait 6px, then look at direction and whether the quote can actually scroll.
Try it
Try it with the sample PDF (no file needed): https://marginalianotes.app/app/?sample=1
The app: https://marginalianotes.app
Code (MIT): https://github.com/dikshantraj09/marginalia
Product Hunt: https://www.producthunt.com/products/marginalia-3
I'd love feedback, especially from people who read a lot of papers or long documents. What would make you actually switch from highlights?

DEV Community: Dikshant Raj

I built a PDF reader where every note remembers its page

C1 · On-Reading-Slowly.pdf, p.1