What is Lottie Creator?

Lottie Creator is a web-based animation creation tool for anyone to get started on designing with motion. There are 300,000+ illustrations and Lottie animations for you to edit and personalize. You can import your team 's private Lottie animations, make edits, add presets, interactivity, and more.

What can I animate with Lottie Creator?

Lottie Creator lets you take advantage of the lightweight Lottie format to create motion graphics for every industry and use case imaginable. It allows you to make edits, change layers, plus add objects, elements, and interactivity before you ship your animation across web, mobile, or other platforms.

What are the formats supported by Lottie Creator?

Lottie Creator enables you to import Lottie JSON, dotLottie, and SVG formats. Likewise, you can export your creations to JSON, dotLottie, MP4, GIF, MOV, WebM, and other popular formats.

Is Lottie Creator free?

Yes, Lottie Creator is a free offering by LottieFiles. It lets you create up to 50 animations before it prompts you to upgrade to a paid tier. Our advanced features, such as optimizing animations, saving to other formats, team collaboration, hosting, etc., are only covered under our paid plans.

Search animations⌘K

Easily edit & customize Lottie animations

Our web-based editor allows you to edit, tweak and personalize your Lottie. Making changes on the go has never been this easy and fun.

Try Lottie Editor

Watch Video

Select. Edit. Save.

It’s now easier than ever to select animation layers, make edits and save different versions of your animation.

Powerful layer selection

Select animation layers on the canvas and reorder them as you wish with the improved layer panel.

Get creative with colors

Change layer colors and give your animation a colorful new look.

Click to change the color

Hide and delete unwanted layers

Bring layers to front or back, delete the layers you dont need. Hide what you dont wanna show.

Try Lottie Editor

Trusted by million+ designers & developers from over companies

Intuitive layer reordering

Give animations a fresh twist by reordering layers easily and intuitively.

Edit text and swap images

Change the text and replace the image layers in your animations for an even deeper level of customization.

X-ray mode for advanced selection

Turn the X-ray mode on for an outline view that will help you inspect and select deeply nested layers.

Click to try out these view modes

Target layers with names and tags

Select the layer you want to target, open up the attributes section and add an identifier (class(es) or id). The IDs tags and classes can be targeted using CSS or JavaScript when rendered on a webpage.

Try Lottie Editor

Customize animations like never before

Motion canvas & editor now available on your mobile app

Want an easier way to customize animations on the go? The LottieFiles mobile app offers a motion editor, templates, stickers & more.

Download mobile app

Motion editor, templates and stickers on the LottieFiles mobile app

FAQ

What is Lottie Editor?

Lottie Editor is an online animation editor that lets you customize and optimize Lottie JSON files without writing code. You can adjust colors, layers, images, and text, then deploy your animations across websites, mobile apps, and design tools using LottieFiles mobile libraries, the web player, or integrations like Webflow.

Common uses include:

Updating animation colors to match brand guidelines
Swapping placeholder images for product photos or icons
Changing seasonal or campaign text without recreating the animation
Optimizing file size for faster web and mobile performance

What’s new in Lottie Editor?

You can now edit Lottie animations from our ready-to-use library, IconScout and the private animations in your workspace. Once Lottie Editor loads your animation, you’ll be able to edit these properties, among others:

Layers – hide, unhide, delete or reorder layers
Colors – change the colors of the elements in your animation, or change the background color
Replace images and update text – replace the images in your Lottie, or update the text on text layers

What's the difference between unique colors and all colors?

When you edit unique colors, you change all instances of that specific color within the selected layer. Editing all colors changes each color instance individually, allowing for more granular control in your Lottie animation.

How do I add ID tags and classes to layers?

Why can’t I edit an animation’s text?

If you can’t edit text in a Lottie animation, it’s often because the font was subsetted during export, limiting available glyphs. This prevents full text changes. Learn more about font subsetting.

Can I use Lottie Editor for free?

Yes, Lottie Editor is free to use for basic edits. Advanced features may require a LottieFiles Pro plan.

Do I need After Effects to use Lottie Editor?

No. Lottie Editor works entirely online — you can upload any Lottie JSON file and make edits without Adobe After Effects.

Can I optimize file size in Lottie Editor?

Yes, Lottie Editor can reduce file size by removing unused layers, cleaning up code, and exporting in the compressed dotLottie format.

Can I edit animations from LottieFiles Marketplace in Lottie Editor?

Yes. Download or open animations from the Marketplace in Lottie Editor to change colors, images, text and more before publishing.

Does Lottie Editor support dotLottie files?

Yes. You can upload and edit animations in the dotLottie (.lottie) format, which is a compressed package of one or more Lottie files.

What’s the difference between Lottie Creator and Lottie Editor?

Lottie Creator lets you build animations from scratch in your browser with tools like shapes, text, and advanced features such as segments and mattes. Lottie Editor, on the other hand, is mainly for adjusting colors.