Lorre Blocks
GitHub

fade-in

lorre

Reveal-on-scroll wrapper: children fade and slide in the first time they enter the viewport, optionally sharpening out of a blur (blur prop). Duration rides the theme's --motion-duration-slow token; delay prop staggers siblings; motion-reduce disables the transition.

npx lorre-blocks add fade-in
First card — staggered 0ms
Second card — staggered 150ms
Third card — staggered 300ms

Dependencies

Registry (installed automatically)

Tags: fade-in · reveal · scroll · viewport · animation · motion · stagger · blur-fade · fade-content