Tutorial

How to Extract Lottie Animations from Any Website

Discover how to instantly download hidden Lottie JSON animations from modern web pages using ZipIt.
ZipIt
ZipIt Team
How to Extract Lottie Animations

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.

Extract Directly from the Web

No browser extension required. Just paste any URL into our web app and instantly extract design tokens, assets, and full source code.

Launch Web App β†’

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."

Unlock premium web animations.

Start extracting high-quality Lottie assets directly from the source with zero hassle.

Grab Extension Try ZipIt Web Pro
πŸ”§ Try Lottie Player Tutorial Lottie Animations Web Design
πŸ”§ Try Lottie Player Tutorial Lottie Animations Web Design
ZipIt

ZipIt Team

The core team behind ZipIt. We build tools that make front-end development and design token extraction blazing fast.

Stay ahead of the curve

Get the latest web design tips, frontend tutorials, and product updates delivered to your inbox once a month.