Scrollcite — Scroll-Highlight Text Component for Framer

Built two ways — this page is the code component. The /override page runs a code override on plain canvas layers.

Scrollcite

Component demo · see /override

02 · Slot component — chips and cards are your frames

This paragraph pulls its chips straight from the canvas. The icon

and its card are frames you can restyle freely — and every source can carry its own design entirely

without touching a line of code.

Text that reads itself.

Scroll-scrubbed reading, inline citation chips, and hoverable source cards — built three ways: code component, slot component, and code override.

Scroll ↓

01 · Code component — everything built in

David Goggins has accomplished numerous impressive feats making it difficult to single out just one. However, one of the most remarkable achievements in his diverse career is completing the 24-hour pull-up challenge where he set a Guinness World Record for the most pull-ups performed. Goggins completed 4,030 pull-ups demonstrating extraordinary physical and mental endurance.

03 · Code override — plain layers, auto-wired

Here the paragraph itself is a normal text layer. An override on the wrapping frame detects it, scrubs every word on scroll, swaps this marker [1] for the layer named Icon 1, and pops the layer named ==Popover 1== over it on [2] hover.

Overrides read your layer names

“Name a frame Icon 1 and it becomes the chip. Name one Popover 1 and it becomes this card. That is the whole API.”

Open source link

A totally different card

Light theme, different radius, different type — because this one is just another frame you own.

Visit source

Built two ways — this page is the code component. The /override page runs a code override on plain canvas layers.