Testimonial Hero GSAP Animation with a 3D Card Loop 😍

In this Webflow GSAP tutorial you learn how to animate a testimonial hero step by step, from the counter as the hero element to a looping card and text swap. Instead of throwing every element on screen at once, you build the animation in layers: fade in the counter first, then reveal the collage, gradients and floating dots like stars, and finally loop through swapping cards and line by line text reveals. You also learn how to use a scroll trigger on the counter, why pausing on leave is better for performance, and how to fake a real 3D perspective directly in the GSAP UI. Everything is built visually in the Webflow Designer with GSAP, so you can rebuild it on your own site right away. --- My courses: 👉 Webflow GSAP Interactions Masterclass: https://www.formburg.com/en/gsap-mast... 👉 Advanced web design techniques for Webflow power users: https://www.formburg.com/en/webflow-e... 👉 All my Webflow courses: https://www.formburg.com/en/courses --- Create a free Webflow account: https://formburg.com/webflow-kostenlos * More free Webflow tutorials: https://www.formburg.com/en/tutorials Affiliate Link --- // TIMESTAMPS 00:00 – Planning the hero animation 00:38 – Setting up the scroll trigger on the counter 01:35 – Fading in the counter elements with stagger 02:45 – Revealing the collage and images 03:30 – Animating the gradient shapes 04:40 – Floating dots like stars 05:30 – Building a second card collection to swap 07:00 – Faking 3D perspective in the GSAP UI 09:30 – Line by line text reveal 11:30 – Looping the whole animation infinitely #webflow #gsap #webdesign