Every long-form article I read has at least three concepts I half-understand. I either open a new tab — and lose the thread I was in — or push through and end up with a shallower read than I wanted. Neither felt acceptable for anything technical or dense.
So I built rabbitholes: a Chrome extension that renders an explanation next to your cursor when you highlight text, inside a shadow-DOM tooltip that doesn't touch the host page's styles or layout. You never leave the article.
The specific thing that changes how I read: you can click any word in the explanation to go deeper, or drag across a phrase to treat it as the next query. The tooltip inherits the prior context, so the new answer knows what you were just reading about. There's a counter showing how many hops deep you are — I've hit eight on a good Wikipedia session.
A few other details worth knowing:
- Globe icon re-runs the query enriched with Brave Search results and shows clickable source chips
- Pencil icon opens a free-form follow-up that inherits current context as background
- Every answer ends with two suggested rabbit-hole topics
- Zero telemetry, no intermediary server — requests go directly from your browser to
api.anthropic.comandapi.search.brave.com - Manifest V3, API key stored in
chrome.storage.sync, never leaves the browser
The shadow DOM choice was deliberate: an iframe overlay can't match host-page fonts without a flash of unstyled content, and injecting styles directly into the page risks breaking the article's layout. Shadow DOM keeps the tooltip fully isolated.
// Simplified: how the tooltip anchors to the selection
const range = window.getSelection().getRangeAt(0);
const rect = range.getBoundingClientRect();
tooltip.style.top = `${rect.bottom + window.scrollY + 8}px`;
tooltip.style.left = `${rect.left + window.scrollX}px`;
Built for my own reading habit. Works on any page.
Top comments (0)