How much does Lottie animation cost in 2026?

Know what the starting price describes

A starting price gives a buyer a useful entry point. It does not mean every request that contains the word icon has the same production cost. One supplied vector icon with simple motion is a different scope from a newly illustrated scene, several interactive states and exports for multiple environments. The quote should describe the work, not rely on a package name alone.

Ask what counts as one deliverable. A coordinated set may share a visual direction but still contain unique illustrations and timing. Alternate colors, responsive compositions, additional languages or product states can be separate work. Clear definitions make proposals easier to compare and reduce avoidable changes later.

What makes a project more involved

Illustration complexity, the number of scenes, custom character movement and integration requirements affect effort. Existing design files can reduce discovery and recreation work, but they still need to be suitable for animation. A flattened screenshot is not equivalent to organized vector artwork. The quality and readiness of inputs matter as much as the final duration.

The target platform can also change the job. An animation intended for several runtime implementations may need additional checks or an alternative treatment for unsupported features. A strict file budget is another design constraint, and should be discussed while the scene is still easy to simplify.

Budget for direction and feedback

The direction phase answers the expensive questions early: what should the animation communicate, how should it look, and how does it fit the product? Skipping this conversation can move the cost into later revisions. A useful approval milestone shows enough of the intended result for the decision maker to assess the idea before final polishing.

Agree the feedback process and included revision rounds. Consolidated feedback is more efficient than separate, contradictory comments from several people. If the story or visual style changes after approval, the original scope may no longer describe the work. Discuss that change before continuing production.

Plan timing without false precision

A single Lottie icon typically has a first preview in 24–48 hours. A 60-second explainer usually takes around 10 days. Those statements describe typical planning points, not unconditional delivery guarantees. Larger sets, onboarding sequences and complex scenes receive a schedule based on the brief and the team’s review availability.

The estimator uses published starting prices and explicit quantity, complexity and urgency factors to provide an indicative range. It is useful for comparing scenarios, but it cannot inspect your artwork or predict feedback. A final quote follows a review of the actual requirements, and priority delivery depends on availability.

Compare proposals by included work

Put proposals next to the same scope checklist: illustration, animation, file formats, source files, revision rounds, integration help and delivery dates. For video, also check script, storyboard, voiceover, music licences and output versions. A lower initial number may describe fewer deliverables rather than a better price for the same work.

Confirm payment milestones and usage rights through the agreed engagement process. Neither a portfolio preview nor a reference link grants permission to reuse a previous client’s artwork. A custom commission should explain what you can use and which assets are being delivered for your project.

Make the first request concrete

Send your product URL, intended screen or story, audience, deadline and the available design assets. Include a few references and explain what interests you: pacing, visual style, interaction or the way a concept is explained. A short, specific brief is more useful than a long list of unrelated animations.

If you are still exploring, ask for a motion audit or use the quiz to identify a starting package. The first scope can be focused: one useful interaction, then a connected set once the direction is established. Expanding deliberately helps maintain consistency without committing to an undefined library all at once.

Build a budget from deliverables

Consider a founder who asks for five animations. That number alone does not establish the scope: five variations of one supplied icon differ from five illustrated onboarding scenes. List each screen, its purpose, the available artwork and the states required. Mark whether the animation plays once, loops or responds to interaction. This inventory becomes the basis of the production estimate.

The published web animation set starts at $500 while an onboarding set starts at $2,000. These entry points describe different kinds of work; they should not be divided into an assumed per-scene price without a brief. The estimator provides a way to compare planning scenarios, and the proposal identifies exactly which scenes and deliverables the agreed budget includes.

Separate essential launch work from later enhancements. A first milestone might cover the one interaction that is currently confusing, with a second milestone extending the approved language across the product. That can reduce the risk of revising a large set after stakeholders see it in context. It also gives the team a useful integration sample before committing to every screen.

Keep a small change log during review. Record requested changes, the approved direction and any effect on scope or dates. This is useful for both buyer and animator: decisions remain visible, and a new feature is not silently treated as a correction to an earlier specification. Ask for clarification whenever two proposals use the same package name but describe different work.

Published packages and timing

A practical handoff checklist

Before approving delivery, open the animation inside the intended screen with real content. Compare it with the agreed reference and check the start, loop boundary and final state. Confirm that the animation does not cover a control, obscure a label or leave the user waiting for decoration to finish. Review it at the smallest supported layout as well as the desktop presentation.

Ask for the agreed delivery files, a reference preview, the tested player and version, and a note describing triggers and fallback behavior. Confirm source-file and usage-rights arrangements in the project scope. A developer should not need to guess whether an animation loops, which frame is the resting state, or whether an embedded image is intentionally part of the file.

Test slow loading, an unavailable asset, reduced motion and navigation away from the screen. Keep essential instructions and status in accessible HTML. If a sequence is purely decorative, its failure should not block the task. If it helps explain a process, provide an equivalent explanation that remains available without playback.

Finally, assign an owner for future changes. Product copy, design systems and runtime dependencies evolve. Keep the approved source and integration notes together so a later update can be checked against the original intent. This small amount of documentation makes a custom animation easier to maintain beyond the launch.

Frequently asked questions