Learn GSAP

Learn GSAP is a Webflow template by OFF+BRAND, and it's less a website than a playful motion sampler you can pull pieces from. Everything sits on a warm cream background with dark brown type, and the hero is "MAKE IT MEAN MORE WITH GSAP" in huge condensed Anton capitals with a chunky toggle switch, blue knob and all, sitting over the words. A small Webflow and GSAP lockup and an Explore Templates button are the only other elements.

Scroll and a sticky tab bar appears with Flip, Scroll Trigger, Slider, Inertia, Text Effects and Marquee, each jumping to its own demo. Flip shuffles brightly colored cards with a watch, a chair, a sock and a tomato between list and grid views. Scroll Trigger pushes a picture of clouds out from between giant letters. The slider uses retro illustrated portraits on green and cyan cards with a progress bar, Inertia lets little running figures fly across an orange band, and Text Effects offers six buttons for split, scramble and slide reveals. The marquee section tilts two dark bands of scrolling type across the screen. A small Copy This card in the corner of each demo hands you the piece to paste into your own project. We like that copy card a lot, because it turns a showcase into something you actually take away.

On a 390px phone the headline drops to two tight lines and the toggle sits under it, with the intro text and button stacked below.

We'd pick it for Webflow designers who want ready-made GSAP interactions to learn from or reuse. Just know what you're getting: there's no about, services or contact page here, so treat it as a parts kit rather than a site you can launch.