Scrold

Scrold colors your text in as the reader scrolls, turns [1] -style markers into inline citation chips, and reveals sources as cards — on hover, on scroll, or both.

Turn long-form reading into a guided experience. Scrold colors your text in as the reader scrolls, turns [1] -style markers into inline citation chips, and reveals sources as cards — on hover, on scroll, or both. Native to Framer, no external libraries. ✨ Features - Scroll-scrubbed reading — words color in progressively, anchoring the reader's eye. - Citation chips — [1] markers become inline chips, right in the text flow. - Source cards — a chip opens its card as a popover with a caret pointing at it. - Reveal modes — Hover , Scroll , or Both . On scroll, each card presents itself as the reading reaches its chip, then hands off to the next. - Phrase highlights — wrap words in ==double equals== for a selection-style highlight. - Bring your own UI — connect your icon and card frames; they stay fully editable. Fill, radius, shadow, CMS binding — just Framer layers. - Full controls — unread/read/highlight colors, size, weight, line height, chip size, caret, and the scroll window the scrub runs over. - Canvas-safe — built on Framer's static renderer API; the editor stays fast. 📦 Three ways to use 1. Code Component — drop it in, paste your text, fill the chips array. 2. Slot Component — connect your own text, icon, and popover layers. Zero code. 3. Code Override — apply to a frame that already holds your text and cards; it finds them by layer name. 🚀 Quick start (slots) 1. Insert the slot component. 2. Type [1] , [2] where you want chips — in Text or a connected text layer. 3. Connect icon frames to Icons , card frames to Popovers — chip n pairs with popover n . 4. Pick a Reveal mode, then preview. 💡 Notes The scrub and cards run in preview and on your published site; the canvas shows a static preview with numbered chip markers, so nothing animates while you design. Questions? Reach out via the support link — feedback shapes the roadmap.

Custom-built text interaction