MailViewr - Free HTML Email Preview Tool
← CSS Support Index

Does CSS transition Work in HTML Email?

Creates a visual transition when changing CSS properties.

Quick Answer

Does transition work in HTML email?

The CSS transition property is supported in Apple Mail, Thunderbird, ProtonMail, Fastmail. It is NOT supported in Gmail, Outlook (Windows), Outlook (Mac / Web). Always include a safe fallback for unsupported clients.

Which Email Clients Support CSS transition?

CSS support for transition across email clients

Email ClientDesktopMobile / WebNotes
Gmail✗ No✗ No
Outlook (Windows)✗ No?
Outlook (Mac / Web)✗ No✗ No
Apple Mail✓ Yes✓ Yes
Yahoo! Mail~ Partial~ Partial
Samsung Email?~ Partial
Thunderbird✓ Yes?
ProtonMail✓ Yes✗ No
Fastmail✓ Yes?

Notes

  • #1 Partial. Longhand properties are not supported.
  • #2 Buggy. The `all` keyword is not supported.
  • #3 Buggy. `transition-duration` is forced to `0` on a global reset style.
  • #4 Transition properties are supported but pseudo-classes like `:hover` are not.
  • #5 Partial. Not supported with Outlook accounts.

This page accounts for the shorthand `transition` property and the longhand properties `transition-delay`, `transition-duration`, `transition-property` and `transition-timing-function`.

Frequently Asked Questions

Related CSS Properties

Test Your Email Now

Paste your HTML and see how it renders in clients that don't support
transition.

Open Email Previewer