How to Edit Lottie Animations Without After Effects

After Effects is excellent for creating motion from scratch, but most Lottie requests that reach a developer are smaller than that. A brand color changed. A screenshot inside an onboarding animation is out of date. A loader is too heavy for the bundle. Marketing needs a GIF for an email that cannot run a player. None of these require new motion, and many teams no longer have the original .aep project anyway.

A Lottie file is JSON. Colors are arrays of numbers, embedded images are base64 strings, and timing is a frame rate plus in and out points. Edits that only change those stored values are safe to make outside a motion tool. Edits that need new keyframes, new shapes, or new layers are not, because there is nothing in the file to change yet.

The table below maps common requests to what they touch inside the file and the tool that handles them. Every row was tested against a real file for this guide; the measured results are in the sections that follow.

Open the Color Changer and drop in the JSON or ZIP. The tool walks the file, collects every solid color it finds in fills and strokes, and lists each one with how many times it is used. Pick the swatch you want to change, enter the new value, and apply. The preview keeps playing so you can judge contrast on the real animation rather than on a palette chip.

In our test with brand-badge.json, the export differed from the original in exactly six numbers: the channels of the two colors we swapped. Nothing else changed. That is the property to look for in any browser editor. If a tool re-exports the whole animation through its own model, small rounding changes in keyframes can creep in, and those are hard to spot until a loop starts to stutter.

Many marketing and onboarding animations are built around embedded bitmaps: a product screenshot, a logo, an avatar. In the JSON these sit in the assets array as base64 data, referenced by an image layer. Image Replace lists every image asset with its pixel size and byte size. Our product card sample showed one asset, img_0.png, at 300 by 180 pixels and 26.8 KB.

Replacing the asset keeps the layer, its position, its scale, and its animation; the new image is drawn into the same box. Our replacement was the same 300 by 180 size, so it dropped in without adjustment and the asset grew only to 29.8 KB. A replacement with a different aspect ratio needs cropping first, and a 2,000-pixel photo dropped into a 300-pixel slot looks the same on screen but can add hundreds of kilobytes to the file.

Delivery problems are often about size or format rather than content. The Lottie Compressor removes formatting, deletes image assets that no layer references, and merges byte-identical images. On our bloated product card, which carried a duplicate and an unused copy of its screenshot, the downloaded file went from 119,611 to 38,869 bytes with playback unchanged.

When a channel cannot play Lottie at all, export a GIF. Be aware that GIF stores frame delays in hundredths of a second, so some frame rates cannot be represented exactly. Our 30 fps, 90-frame badge became a GIF with 3-hundredth delays, which plays the loop in 2.7 seconds instead of 3.0. For a loader that is fine. For an animation synced to sound, it is not.

Use a motion tool when you need to redraw shapes, change keyframes, adjust easing curves, modify masks, rebuild compositions, or add states. A browser editor should not pretend those are simple file edits, and EasyLottie does not try.

The productive workflow uses both categories honestly. Author and restructure motion where it was created. Do the final color, asset, size, and format work in the browser when the delivered file is already close. That split also keeps the source project clean: you are not re-exporting an animation and risking subtle drift for what is really a one-value change.