How to Extract Lottie Animations from Any Website

Lottie is the undisputed king of web animation. It allows designers to export After Effects animations as tiny JSON files that run perfectly across web, iOS, and Android. The problem? When you see a stunning Lottie animation on a website, getting access to that underlying .json file is notoriously difficult.

The Challenge of Extracting Lottie

Because Lottie files are loaded dynamically via JavaScript (often using libraries like `lottie-web`), they rarely appear in the source HTML as a clean <img src="..."> tag. If you inspect the element, you'll just see an empty <div> or a complex SVG being drawn in real-time.

Extracting with ZipIt

ZipIt has a dedicated engine that listens to network requests and parses JavaScript bundles to locate the source JSON files for active Lottie animations.

1. Ensure the Lottie animation is currently playing or visible on your screen.
2. Open the ZipIt extension panel.
3. Navigate to the Media & Assets tab.
4. ZipIt will list all detected animations. Simply click the download button, and you'll receive the raw `.json` file instantly.

"With the JSON file in hand, you can upload it to the LottieFiles editor, change the colors, tweak the timing, and drop it straight into your own projects."