Upload a `.json` Lottie animation, inspect the colors used in fills and strokes, replace them with color pickers, preview the result live, and download the modified JSON without uploading anything to a server.
Load a Lottie JSON file to preview the animation and unlock color editing.
Your animation JSON is parsed, rendered, edited, and downloaded entirely in the browser.
The editor scans Lottie color properties and updates only the discovered color arrays instead of rewriting unrelated structure.
Every color change re-renders the animation immediately so you can inspect the result before downloading.
Download an updated `.json` file with the original structure preserved except for the color values you changed.
All processing happens locally in your browser. Your data is never uploaded to any server.
Use this Lottie editor to preview and recolor Lottie JSON animations online for free. Lottie files are lightweight JSON animations exported from Adobe After Effects through Bodymovin and widely used in apps, landing pages, onboarding flows, and product interfaces. When you need a quick brand refresh, a dark-mode variant, or a client-specific colorway, editing the color arrays directly in the JSON is often the fastest route.
This tool inspects the uploaded animation locally in your browser, finds editable fill and stroke colors, lets you update them visually, then downloads a modified JSON file. Because the editing logic only touches discovered color arrays, the original animation structure stays intact as much as possible.
The editor traverses the parsed Lottie JSON and looks for standard color properties used by fills and strokes. Static color arrays and animated keyframe color arrays are normalized into swatches, then updated in place when you pick a replacement color.
Yes. The live preview makes it useful for quick visual QA before you commit a recolored animation into a codebase, design system, or marketing site.
The tool validates the uploaded structure and shows a clear message when the file does not look like a standard Lottie JSON animation.
For adjacent frontend work, try the Color Picker, JSON Formatter, and Image to Base64 tools.
Edit Lottie JSON online free with FreeToolBox — preview animations, inspect reusable colors, recolor fills and strokes, and export an updated Lottie file without opening a desktop motion app. This is useful for developers adapting app animations to a brand palette, designers preparing light/dark theme variants, and teams cleaning up handoff assets before shipping them into web or mobile projects.
Everything runs locally in your browser. Your Lottie JSON file is never uploaded to any server, which matters when you're working with internal product assets, unreleased UI states, or licensed animation packs. Completely free, no account required.
Use Lottie Editor when your main job is previewing and recoloring a Lottie JSON file. If you need to choose the exact palette first, start with Color Picker. If you are exporting supporting image assets for the same motion system, continue with the broader Image Tools hub.
No-upload workflow: motion assets, product animations, and unreleased UI files stay local in your browser while you edit and export them.
No. This tool is focused on preview and color editing, not full motion-authoring. For timeline or keyframe changes, you still need the original animation source workflow.
Color swaps, theme variants, quick brand alignment, and export-ready JSON tweaks are the best fit. It's especially useful when the animation structure is already correct and only the visual palette needs adjustment.