The ScrollReveal component lights up text word by word as the reader scrolls past it, tied to scroll position rather than a timer.
Add it with the CLI, open it in v0, or copy the source into your project.
Adds the component and installs its dependencies for you.
npx shadcn@latest add https://uibeats.com/r/scroll-reveal.jsonEverything Scroll Reveal accepts.
| Prop | Type | Default | Description |
|---|---|---|---|
| children (required) | string | No default | The text to reveal, as a plain string |
| restingOpacity | number | 0.15 | Opacity of a word before it is reached |
| spread | number | 0.5 | How much of the viewport the reveal is spread across, 0-1 |
| className | string | '' | Additional CSS classes for styling |
Required.
Scrollandeverywordarrivesinturn,tiedtothescrollbarratherthantoatimer.