MailViewr - Free HTML Email Preview Tool
← CSS Support Index

Does CSS @media (prefers-reduced-motion) Work in HTML Email?

Media query that detects whether the user has requested reduced motion in their system settings.

Quick Answer

Does @media (prefers-reduced-motion) work in HTML email?

The CSS @media (prefers-reduced-motion) property is supported in Outlook (Mac / Web), Apple Mail, Samsung Email. It is NOT supported in Gmail, Outlook (Windows), Yahoo! Mail, and others. Always include a safe fallback for unsupported clients.

Which Email Clients Support CSS @media (prefers-reduced-motion)?

CSS support for @media (prefers-reduced-motion) across email clients

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

Notes

  • #1 Not supported. `@media (prefers-reduced-motion:reduce)` is transformed into `@media none`.
  • #2 Partially supported. Not supported on `picture`.

Frequently Asked Questions

Related CSS Properties

Test Your Email Now

Paste your HTML and see how it renders in clients that don't support
@media (prefers-reduced-motion).

Open Email Previewer