Lottie GSAP Widget

Lottie GSAP Widget to seamlessly animate Lottie files with GSAP

Bring your designs to life with smooth, lightweight Lottie animations, fully controllable within Elementor using Gloo’s GSAP-powered animation system. The Lottie GSAP Widget allows you to upload animated JSON SVG files, toggle autoplay, and assign a unique ID for use with Gloo‘s GSAP Lottie Tween, enabling precise, scroll-based or event-driven animations.

Widget General Settings

The General Settings provide control over the Lottie animation behavior inside the Elementor editor.

• Upload Animated SVG JSON
  Upload a Lottie animation in JSON format. This file contains the vector-based animation data and will be rendered smoothly without performance overhead.
• Lottie ID
  Assign a unique identifier to the animation. This ID will be essential when linking the Lottie animation to Gloo’s GSAP Lottie Tween for advanced animations.
• Auto Play
  Toggle autoplay On to have the animation play as soon as the page loads. Turn it Off if you plan to control playback via GSAP animations.

Be sure to check out the GSAP Lottie Tween module page to learn how to animate your Lottie files with Gloo’s powerful GSAP integration.