GSAP + ScrollTrigger

The choreographer for everything that moves.

THE MOTION

ON THIS BUILD: USED ON THIS BUILD
WHERE IT RUNS: Runtime · home build table · services cutaway
OFFICIAL DOCS: Read the reference →

What it is

The scroll timeline behind the home build table and the services cutaway. GSAP + ScrollTrigger pin and scrub the sequence; the runtime is checked by scrolling it, not by a frame benchmark.

What it does for your business

For your business it means attention stays on the page instead of sliding past it. The story unfolds at the visitor's pace, with a reduced-motion still for anyone who asks for one.

Why it earns its place

Scroll is the one input every visitor has. GSAP and ScrollTrigger turn it into a timeline that can be pinned, scrubbed and cleaned up, instead of a pile of one-off listeners.

Powering the scroll choreography on this site's home page. We check it by scrolling it and looking at it; we do not publish a frame-by-frame measurement.

THE TOOL

Open GSAP + ScrollTrigger Read the official docs →

The build table

USED ON THIS BUILD

Version

3.13

Plugin

ScrollTrigger

Scroll source

Lenis

Cleanup

context / kill

The home page's HELLO → LIVE rail is the visible use. The services cutaway uses the same plugin with its own context.

How it runs here

The plugin registers once, timelines live inside a `gsap.context`, and every trigger is killed on unmount. The scroll position comes from Lenis, so there is one clock and one owner.

A PINNED SEQUENCE

gsap.registerPlugin(ScrollTrigger);const ctx = gsap.context(() => {  ScrollTrigger.create({    trigger: section,    start: "top top",    end: "bottom bottom",    invalidateOnRefresh: true,  });});return () => ctx.revert();

When it runs

A section has a sequence that must follow the scroll. Not for a fade that CSS can do without a runtime.

Who owns it

Build writes the timeline. Motion sets the choreography. QA checks the reduced-motion still and the cleanup path.

What it does not claim

No frame-by-frame benchmark is published. The check is a real scroll and a look, not a synthetic score.

THE REFERENCE

The manual above is ours. The vendor's reference is the place to check an API, a version or a limit.

Open the official docs →

This is the tool. The process is what turns it into your business.

File the brief