Scroll reveal
Fades, lifts and sharpens content as it scrolls into view, with staggered children, once or repeat, and scroll-container support.
Preview
Changelog
Install
Pro source requires Pebble Pro. Try the full preview above.
Props
| Prop | Type | Default | Description |
|---|---|---|---|
| once | boolean | true | Reveal the first time only, or hide and replay on every pass. |
| amount | number | "some" | "all" | 0.3 | How much of the element must be visible to trigger. |
| margin | string | — | Grows or shrinks the trigger area (rootMargin). |
| root | RefObject<Element> | — | Scroll container to watch instead of the window. |
| distance | number | 14 | Rise in px. |
| blur | boolean | true | Start slightly blurred and sharpen on arrival. |
| stagger | number | 0 | Seconds between ScrollRevealItem children. 0 animates the wrapper itself. |
| delay / duration | number | 0 / 0.55 | Seconds before starting / per element. |
Pro component
Try the full preview above. Editable source and build guides require Pebble Pro.
