TinyLottie

Make Your Lotties
Lighter Than Air

Shrink After Effects JSON and dotLottie animation file sizes up to 98% while preserving every frame. The ultimate Bodymovin optimizer with zero uploads and 100% privacy.

Everything You Need, Nothing You Don't

Powerful optimization tools designed for developers, designers, and teams who value performance and privacy.

Universal Format Compatibility

Seamlessly works with Lottie JSON and dotLottie files. Switch between formats effortlessly while preserving your animation's integrity.

Smart Compression Engine

Intelligent algorithm analyzes and compresses your animations by removing redundant data, achieving up to 98% size reduction without visual loss.

Blazing Fast Processing

Lightning-speed optimization powered by modern browser technology. Process multiple files in seconds, not minutes.

Zero-Upload Security

Your animations never touch our servers. Everything processes locally in your browser, guaranteeing absolute privacy and data security.

Precision Optimization

Advanced techniques including decimal rounding and metadata stripping ensure maximum file size reduction while maintaining perfect playback.

Instant Download

Get your optimized files immediately with one click. No waiting, no queues, no sign-ups required.

98%
Max Compression
100%
Privacy
0ms
Server Upload
Free
Forever

How to reduce Lottie file size?

Five techniques that matter most — TinyLottie applies all of them automatically.

Strip Metadata

Remove layer names, match names, and expression metadata — only needed by design tools, not at runtime. Saves 10–30%.

Round Coordinates

Trim float precision from 6 to 3 decimal places. Invisible to the eye, but dramatically reduces numeric payload.

WebP Asset Conversion

Embedded PNG/JPEG images inside Lottie JSON convert to WebP automatically — often the biggest single win at 40–70% savings.

Remove Hidden Layers

Layers with hd: true or 0% opacity throughout still add file weight. TinyLottie strips them automatically.

Switch to dotLottie

The .lottie binary format applies ZIP compression on top of JSON, cutting an additional 30–40% vs raw JSON.

TinyLottie applies all of this automatically

Just drag and drop — no configuration needed.

100% client-side| No uploads| Free forever

Simple, Transparent Pricing

Pay once, use forever. No hidden fees, no subscriptions.

Free Plan

Perfect for casual optimization and small projects.

$0/ forever
File limit up to 3 MB
100% offline local processing
Lottie & dotLottie optimization
WebP image compression
Unlimited file sizes
Priority email support
Popular

Lifetime PRO

For designers, developers, and power users.

$99/ lifetimeONE-TIME
Unlimited file sizes (no limits)
100% offline local processing
WebP image compression
Priority email support
Early access to Figma plugin & API
Support active development
Upgrade to Pro
Platform Guides

Lottie Optimization for Every Platform

Pick your platform. Get the exact steps.

🌐

Webflow

Improve Core Web Vitals with smaller Lottie assets

1

Export from Bodymovin

Export your AE animation as Lottie JSON via the Bodymovin plugin — uncheck 'Original Asset Names' to trim extra metadata before you even start.

2

Compress with TinyLottie

Drop the .json into TinyLottie. It strips layer names, hidden elements, and rounds float precision. Most Webflow Lottie files shrink 50–98%.

3

Lazy-load in Webflow

Set the 'Start Animation' trigger to 'Scroll into view' instead of 'Page load' — this defers parser work until the element is visible.

4

Use dotLottie for custom code

For Webflow custom code embeds, use the .lottie output from TinyLottie — 30–40% smaller than JSON and loads faster over the network.

TinyLottie handles all the heavy lifting — just drag & drop your file.Try it free

Webflow Lottie optimization guide

Export from Bodymovin: Export your AE animation as Lottie JSON via the Bodymovin plugin — uncheck 'Original Asset Names' to trim extra metadata before you even start.

Compress with TinyLottie: Drop the .json into TinyLottie. It strips layer names, hidden elements, and rounds float precision. Most Webflow Lottie files shrink 50–98%.

Lazy-load in Webflow: Set the 'Start Animation' trigger to 'Scroll into view' instead of 'Page load' — this defers parser work until the element is visible.

Use dotLottie for custom code: For Webflow custom code embeds, use the .lottie output from TinyLottie — 30–40% smaller than JSON and loads faster over the network.

React Native Lottie optimization guide

Why size matters more on mobile: React Native re-parses the full JSON on every component mount. A 2MB file can add 150–300ms of CPU blocking on mid-range Android devices.

Compress before bundling: Run your .json through TinyLottie first. It removes nm/mn properties (only needed by design tools) and rounds floats — invisible to the renderer.

Cache with useMemo: Memoize your animation source with useMemo() or React.memo() to prevent redundant re-parsing across screen navigations.

Use dotLottie format: Switch to @lottiefiles/dotlottie-react-native. The .lottie binary format parses faster than JSON and is smaller to transfer over the network.

After Effects Lottie optimization guide

Disable unnecessary export options: In Bodymovin, uncheck 'Original Asset Names' and 'Slot IDs'. Enable 'Glyph compression' for text layers. These tweaks alone cut 10–20% before optimization.

Run through TinyLottie: TinyLottie strips nm (layer name), mn (match name), cl (class), and hidden layer flags. For a typical 50-layer rig, this saves 15–35%.

Float precision trimming: AE stores keyframe values with 6–8 decimal places (e.g. 359.9999847). TinyLottie rounds to 3, identical visually but far smaller as a string.

Embedded asset WebP conversion: If your AE comp has raster layers (logos, backgrounds), TinyLottie converts base64 PNG/JPEG assets to WebP — 40–70% smaller.

Figma Lottie optimization guide

Flatten paths before export: Figma stores bezier curves with many redundant anchors. Use Flatten Selection (Cmd+E) before running the LottieFiles or Jitter plugin to pre-simplify.

Compress with TinyLottie: The optimizer rounds all bezier coordinates to 3 decimal places and removes metadata. Figma exports typically see 45–75% reductions.

Remove hidden/masked layers: Figma plugins sometimes export masked layers that contribute to weight. TinyLottie removes all layers where hd: true automatically.

Output as dotLottie: For Figma exports with dense path data, the dotLottie output applies ZIP compression on top — achieving 80%+ total reduction from the original.

Next.js Lottie optimization guide

Always use dynamic import (ssr: false): Lottie libraries use Canvas and rAF — they can't run server-side. Import dynamically: const Lottie = dynamic(() => import('lottie-react'), { ssr: false }).

Compress JSON with TinyLottie first: Reducing a 500KB animation to 80KB means 420KB less JS parsed on every page load — directly improving your LCP and INP Core Web Vitals scores.

Serve from /public, not your bundle: Fetch from /public/animations/hero.json on the client instead of importing JSON directly. This splits animation data from your JS bundle and enables browser caching.

Trigger with Intersection Observer: Don't autoplay on mount. Start animation playback only when the element enters the viewport — improves perceived performance and saves CPU on initial load.

How does TinyLottie work

Everything you need to know about optimizing your Lottie animations

Still have questions?

Have a specific question or need help? We're here to assist you.

Contact Support