Scroll-Scrubbed Lottie

A Lottie timeline whose playhead is bound to scroll position (goToAndStop per frame).

★ showcaseLottieGSAPScrollTrigger

lottie-web with autoplay:false; a ScrollTrigger scrub tween drives {frame} and calls goToAndStop(frame, true).

The canvas renderer is faster for many shapes; SVG stays crisp and inspectable. Toggle and compare in the HUD.

Reduced mode jumps to the final frame.

Playgroundscroll

Lenis lerp0.10

Scrub smoothing0.80 s

ScrollTrigger markers

Renderer

Export

{
  "lerp": 0.1,
  "scrub": 0.8,
  "markers": false,
  "renderer": "svg"
}