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.

Trusted by 4 million+ designers & developers from over 250,000+ companies

Trusted by 4 million+ designers & developers from over 250,000+ companies

Trusted by 4 million+ designers & developers from over 250,000+ companies

Trusted by 4 million+ designers & developers from over 250,000+ companies

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.

Selecting and reordering the animation layer on a pencil animation
Selecting and reordering the animation layer on a pencil animation
Selecting and reordering the animation layer on a pencil animation
Selecting and reordering the animation layer on a pencil animation

Get creative with colors

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

Change animation layer colors
Change animation layer colors
Change animation layer colors
Change animation layer colors

Hide and delete unwanted layers

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

Hide and delete unwanted animation layers

Editing animations made easy

Intuitive layer reordering

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

Edit text and swap image layers
Edit text and swap image layers
Edit text and swap image layers
Edit text and swap image layers

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.

Target animation layers with layer names, ID tags and classes
Target animation layers with layer names, ID tags and classes
Target animation layers with layer names, ID tags and classes
Target animation layers with layer names, ID tags and classes

Target layers with names and tags

Add ID tags and classes to layers that you can then target via CSS and JS.

Customize animations like never before

Motion canvas & editor now available on your mobile app

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.

Motion editor, templates and stickers on the LottieFiles mobile app
Motion editor, templates and stickers on the LottieFiles mobile app
Motion editor, templates and stickers on the LottieFiles mobile app
Motion editor, templates and stickers on the LottieFiles mobile app

FAQ

FAQ

What is the Lottie Editor?

What’s new in the Lottie Editor?

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

How do I add ID tags and classes to layers?

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

Motion design made easy

Create Animation

Test, Edit & Preview Animations

Optimize & Handoff

Embed & Implement

Design teams love LottieFiles

Logo - LottieFiles showcas

“LottieFiles has extended my career by 10 years. “

Anibal Koliren

Motion Lead at DisneyNow

Logo - LottieFiles showcas

“LottieFiles has extended my career by 10 years. “

Anibal Koliren

Motion Lead at DisneyNow

Logo - LottieFiles showcas

“Lottie integrates swiftly with my workflow, has a small footprint, I can share ideas with my teams rapidly.”

Brian Lee

Senior Animator at Headspace

Logo - LottieFiles showcas

“LottieFiles are super infused to all our products and services to get the personalized feeling just right.”

Vinu Remesan

Head of Motion Design at Gojek

Create. Collaborate. Ship.

Let motion be a part of every design. Let your imagination run wild and make your designs come alive.

Create. Collaborate. Ship.

Let motion be a part of every design. Let your imagination run wild and make your designs come alive.

Create. Collaborate. Ship.

Let motion be a part of every design. Let your imagination run wild and make your designs come alive.

Create. Collaborate. Ship.

Let motion be a part of every design. Let your imagination run wild and make your designs come alive.