Back to guide
Support
Beginner

5 min read

Why Lottie Doesn't Work in Email and What to Use Instead

It's a common assumption that a Lottie animation can just be dropped into an email the way it's dropped into a web page. It can't — and the reason is fundamental to how email clients work, not a bug or a missing feature.

The core problem: no JavaScript, ever

Every Lottie player, without exception, is a JavaScript library that parses JSON and renders it to SVG or canvas at runtime. Email clients strip <script> tags and refuse to execute JavaScript categorically, as a security baseline that predates Lottie by decades. There's no configuration or workaround on the sending side that changes this — the animation simply never runs.

What actually plays in email

Animated GIF is the closest thing to a universal standard for motion in email, because it's just an image format decoded by the rendering engine, no script required. Animated PNG (APNG) works in some clients but has weaker support than GIF across the major email clients. Video embeds are effectively unsupported inline; most clients render a static poster frame or strip the tag entirely.

The Outlook desktop wrinkle

Outlook desktop (2007 and later, on Windows) uses Microsoft Word's rendering engine for HTML email, not a browser engine. It doesn't animate GIFs at all — it renders only the first frame. Any animated fallback you build should still look intentional as a static image, since a meaningful share of business-email recipients will only ever see frame one.

Practical approach

  • Keep the Lottie source for your web app or product UI, and export a short, low frame-count GIF specifically for email — don't reuse a web-optimized Lottie's frame count or duration, GIFs get large fast with more frames.
  • Design the GIF's first frame to look complete and intentional on its own, since Outlook desktop users will only see that frame.
  • If the animation is meant to showcase a product feature, link the static/GIF version in the email to a landing page that has the real, interactive Lottie animation.
  • Test across clients before sending — tools like Litmus or Email on Acid render your markup across the major email clients and will catch GIF/fallback issues before they reach recipients.