EasyLottie Guide
A Free Way to Edit and Convert Lottie in the Browser
A tested walkthrough of free, local browser tools for everyday Lottie jobs, with the measured result of each and the limits you should know before relying on them.
What people actually need from a Lottie editor
Most Lottie edits are small. The colors are off-brand, a logo or screenshot is stale, the file is too heavy, or it needs to become a GIF for a channel that cannot play animations. These are delivery jobs, not motion design, and they often arrive without the original project file.
EasyLottie is a free set of single-purpose browser tools for those jobs. The core tools run locally: the file is read and processed in your browser, and nothing is uploaded. There is no account requirement, no watermark, and no paid tier.
Pick the tool by the job
Each task has a dedicated tool. The table lists what each one does and what it produces.
| If you need to | Use | Output |
|---|---|---|
| Play, inspect, or test a Lottie, ZIP, or .lottie | Lottie Preview | Playback plus file details |
| Recolor the animation | Color Changer | Edited JSON or ZIP |
| Replace a logo, screenshot, or image | Image Replace | Edited JSON or ZIP |
| Make the file smaller | Lottie Compressor | Optimized JSON |
| Turn a Lottie into a GIF | Lottie to GIF | Animated GIF |
| Turn MP4, MOV, WebM, or GIF into Lottie | MP4 to Lottie | Lottie ZIP, GIF, WebM, or PNG frames |
| Turn a Figma animation into Lottie | Figma to Lottie | Vector Lottie |
| Recolor an animated SVG | SVG Color Changer | Recolored SVG |
Preview and inspect first
Start every job in the viewer. It plays JSON, ZIP, and .lottie files, and shows the frame rate, duration, dimensions, version, and the files inside a package. With our brand-badge.lottie it found the animation at a/brand-badge.json and reported 30 fps, 3.00 seconds, and 400 by 400 pixels. Knowing those numbers before you edit avoids surprises later, such as a canvas that is far larger than its display slot.
Recolor and replace images
The Color Changer lists each solid color with a usage count and lets you swap it while the animation plays. In our test, swapping two of the badge's six colors changed exactly six numbers in the export and nothing else. Image Replace lists embedded bitmaps by thumbnail, pixel size, and byte size, so you can see exactly what you are swapping. Match the original aspect ratio, and keep the new image close to the original pixel size to avoid bloating the file.
Compress and convert
The compressor first shows where the bytes go: animation structure, embedded images, fonts, and other assets. Its safe mode removes formatting, deletes image assets that no layer uses, and merges byte-identical images. On our bloated product card that took the download from 119,611 to 38,869 bytes with playback unchanged.
Lottie to GIF renders every frame and encodes a GIF locally. Two things to know. First, GIF timing is stored in hundredths of a second, so 30 fps becomes 33.3 fps and the loop gets shorter; 25 or 50 fps stay exact. Second, GIF is large: our 6.8 KB badge became an 824 KB GIF at 480 pixels. Use it for email, chat, and README files, not for web pages that can run a player.
Why local processing matters
Many free online tools upload your file to a server to process it. EasyLottie's core tools do not: parsing, editing, compression, and GIF encoding run in your browser tab. That keeps client work and unreleased product screens on your device, avoids upload queues, and means there is no per-plan file size limit. Server features are optional and labeled: cloud sync, share links, and the AI generator.
When you still want a motion tool
If you need to change the motion itself, such as retiming, re-easing, adding animated elements, or building an animation from scratch, use After Effects or another authoring tool. The browser tools are for files whose motion is already right. For the common case of "the animation is fine, I just need to change one thing," they are faster than reopening a project.
Quick checklist
- Preview the file first and note its frame rate, size, and assets.
- Recolor with the Color Changer for brand or dark-mode variants.
- Replace stale logos and screenshots at the original aspect ratio.
- Compress before shipping, especially after editing.
- Export GIF only where Lottie cannot play, at 25 or 50 fps for exact timing.
Reproduce the workflow
Use these local sample files to repeat the checks described in this guide. Review the file before using it in a production project.
Tested result: five jobs, five real files
We ran each tool on a known sample in Chrome on desktop macOS on 2026-10-11, downloaded the real output, and inspected it outside the browser. The files are available above so the results can be reproduced.
| Job and input | Tool | Measured result |
|---|---|---|
| Inspect brand-badge.lottie | Lottie Preview | Found a/brand-badge.json; 30 fps, 3.00 s, 400×400 |
| Recolor brand-badge.json | Color Changer | 6 colors found; 2 swapped, only 6 numbers changed |
| Find images in product-card.json | Image Replace | 1 asset listed: 300×180, 26.8 KB |
| Shrink product-card-bloated.json | Lottie Compressor | 119,611 to 38,869 bytes; 2 of 3 image assets removed |
| Export brand-badge.json as GIF | Lottie to GIF | 480×480, 90 frames, 823,610 bytes, 2.7 s loop |
The compressor removed an unreferenced image and merged a byte-identical duplicate. Both image layers now point at the one remaining asset, so playback is unchanged.
The GIF loop is 10 percent shorter than the Lottie. GIF frame delays are stored in hundredths of a second, so 30 fps (3.33 hundredths) is rounded to 3, and 90 frames play in 2.7 seconds instead of 3.0.
The GIF is about 120 times larger than the Lottie it came from. That is normal: GIF stores every pixel of every frame, while Lottie stores shapes and keyframes. Use GIF only where a Lottie player cannot run.
Know the limits
- These tools edit and convert existing files. They do not author new motion, add layers, or change keyframes and easing.
- Colors inside gradients with many stops, expressions, or raster images are not editable as color values.
- GIF export cannot keep exact timing for every frame rate, supports only fully transparent or fully opaque pixels, and produces much larger files.
- Optional features that need a server, such as cloud sync, share links, and AI generation, upload data. The core editing tools do not.
If your result is different
- 1.If a file fails in every tool, open it in Lottie Preview first and read the error. Most failures are invalid JSON or missing image files.
- 2.If a recolored or compressed file looks wrong, compare it with the original in the preview side by side before shipping.
- 3.If a GIF loop is out of sync, choose a frame rate that divides 100 evenly, such as 25 or 50 fps, so each delay is exact.
- 4.If a task needs new motion, go back to the source project in your motion tool.
Frequently asked questions
Is there a free way to edit a Lottie without After Effects?
Yes. EasyLottie's preview, recolor, image replace, compress, and GIF tools are free and run in your browser. They edit existing files; creating new motion still needs a motion tool.
Do I need to sign up or pay?
No. All tools are free with no account, no watermark, and no paid tier. An optional account only adds cloud sync and share links.
Are my files uploaded to a server?
The core tools process files locally. Only optional features you choose, such as cloud sync, share links, or AI generation, upload data.
Why is my GIF loop shorter than the Lottie?
GIF frame delays use hundredths of a second, so some frame rates round. At 30 fps each delay becomes 3 hundredths and a 3-second, 90-frame loop plays in 2.7 seconds. Use 25 or 50 fps for exact timing.
Can it edit the motion or timing?
No. It edits colors, images, size, and format. Changing keyframes or easing is a job for a motion design tool.
Primary sources
Technical behavior was checked against the original runtime or format documentation below.