Enhance Your Site's Engagement with GSAP SVG Scroll Animations

Enhance Your Site's Engagement with GSAP SVG Scroll AnimationsEnhance Your Site's Engagement with GSAP SVG Scroll Animations

The network for creativity

Join 1.25M professional creatives like you

Connect with clients, get discovered, and run your business 100% commission-free

Creatives on Contra have earned over $150M and we are just getting started

Back to feedPost

Sohrab Khan

• 15h

A line. A scroll. A little bit of GSAP magic.

Built this SVG draw animation using GSAP + ScrollTrigger to make the illustration reveal itself naturally as you move through the page.

Sometimes the simplest interactions leave the strongest impression.

#GSAP #ScrollTrigger #SVG #CreativeCoding #FrontendDevelopment #MotionDesign

Lynksen Digital

pro

• Jul 7

How do you turn a brand mascot into a visual system people actually remember?

🐆 Our lynx represents sharp thinking, curiosity, and attention to detail. For this motion experiment, we pushed the mark into a softer, unexpected direction - rebuilding it with different textures.

Same identity, different emotion.

Which texture fits the Lynksen identity best - flowers, grass, or something else? 👇✨

Adobe After Effects Adobe Illustrator Figma Visual System Designer Brand Design Logo Design brandidentity

António Ribeiro

• Jul 7

I personally love the soft blue and white version the most. Nice to scale it into the brand campaign or ad video 😃

Ferroz Productions

• Jul 7

Snippet from a recent animation 👌

Adobe After Effects Animation 2D Animation

Nawras M Khrais

pro

• Jul 8

So premium! 👌✨️

Julie Andria

pro

• Jul 7

Studying shapes and textures for a client project using @Spline ⛰️💎

Spline Design 3d texture Spline 3D Modeling

MD Rafee Alam

• Jul 8

The material variation across the pebbles, matte stone next to that glassy blue one, is what sells the realism here. Good foundation to study before jumping into the actual client asset.