Skip to main content
Emailens
HTML & Email Structure

meta-color-scheme

CSS property · 2 supported, 2 partial, 16 unsupported across 21 clients

As of Oct 14, 2026, meta-color-scheme fails or degrades in 19 of 21 email clients, treat it as progressive enhancement, never structure.

  • 0/7 webmail, 2/6 desktop, 0/8 mobile clients support meta-color-scheme fully.
  • Unsupported in Gmail, Outlook 365, Outlook (New), Outlook Classic and 12 more.
  • Partial in Gmail Android, Gmail iOS, behavior differs from browsers, test before relying on it.
  • Outlook Classic (Word engine, supported to at least 2029) does not fully support meta-color-scheme, and its replacement changes little here; see the deprecation diff.
  • Across all clients, only 6 of 298 tracked HTML/CSS features render identically everywhere.

Source: caniemail.com (MIT), via the Emailens engine. Last tested upstream Sep 16, 2026, synced by Emailens Oct 14, 2026.

<meta name="color-scheme" content="light dark"> is an HTML head metadata directive that informs email client webview renderers of dark mode support before the stylesheet is parsed. Along with vendor prefixes like supported-color-schemes, it prevents flashes of unstyled theme and signals dark-mode readiness.

Client Support

ClientCategoryEngineSupport
GmailwebmailGmail WebUnsupported
Gmail AndroidmobileGmail MobilePartialSee caveat 1
Gmail iOSmobileGmail MobilePartialSee caveat 1
Outlook 365webmailOutlook WebUnsupported
Outlook (New)desktopOutlook WebUnsupported
Outlook ClassicdesktopMicrosoft WordUnsupported
Outlook iOSmobileOutlook MobileUnsupported
Outlook AndroidmobileOutlook MobileUnsupported
Outlook for MacdesktopWebKitUnsupported
Apple MaildesktopWebKitSupported
Apple Mail iOSmobileWebKitUnsupported
Yahoo MailwebmailYahooUnsupported
Yahoo Mail AndroidmobileYahooUnsupported
Yahoo Mail iOSmobileYahooUnsupported
Samsung MailmobileSamsungUnsupported
ThunderbirddesktopGeckoSupported
HEY MailwebmailWebKitUnsupported
Proton MailwebmailProtonUnsupported
AOL MailwebmailAOLUnsupported
FastmailwebmailFastmailUnsupported
SuperhumandesktopBlinkUnknown

Documented caveats (1)

  1. 1.Gmail Android, Gmail iOS: Partial support. Only the value light only is supported (see Google IssueTracker.

Caveats recorded by caniemail.com (MIT) and carried verbatim, one entry per wording rather than per client.

Client-by-client behaviour for meta-color-scheme

Fully supports meta-color-scheme (2): Apple Mail, Thunderbird.

Partial support (2): Gmail Android, Gmail iOS. Expect rendering quirks unique to each engine. Partial support typically means a subset of values, an ignored shorthand, or sanitizer-specific rewrites.

No support (16): Gmail, Outlook 365, Outlook (New), Outlook Classic, Outlook iOS, Outlook Android, Outlook for Mac, Apple Mail iOS, Yahoo Mail, Yahoo Mail Android, Yahoo Mail iOS, Samsung Mail, HEY Mail, Proton Mail, AOL Mail, Fastmail. Plan fallbacks for these clients before relying on meta-color-scheme in production sends.

Behaviour unverified in: Superhuman.

When to use meta-color-scheme in email

  • Declaring dual-theme compatibility at the document head to activate native dark mode rendering in Apple Mail and webmail.
  • Eliminating the bright white canvas flash when recipients open dark-themed emails in dark-mode clients.
  • Working in tandem with CSS color-scheme and media queries to establish an end-to-end dark mode protocol.

Rendering behaviour and edge cases

  • Apple Mail on macOS reads <meta name="color-scheme"> to adapt the background frame; iOS Mail historically requires <meta name="supported-color-schemes"> alongside CSS :root color-scheme.
  • Outlook desktop and webmail strip <meta> tags from the document head during message sanitization.
  • Gmail webmail strips custom <meta> tags in <head>, applying dark mode based on its own webmail interface settings.

Recommended fallback strategy

Include both <meta name="color-scheme" content="light dark"> and <meta name="supported-color-schemes" content="light dark"> inside <head>. Mirror the directive with :root { color-scheme: light dark; } in your primary <style> block.

Fixes & Workarounds

Gmail

Unsupported

"meta-color-scheme" is not supported in this email client.

Outlook 365

Unsupported

"meta-color-scheme" is not supported in this email client.

Outlook (New)

Unsupported

"meta-color-scheme" is not supported in this email client.

Outlook Classic

Unsupported

"meta-color-scheme" is not supported in this email client.

Outlook iOS

Unsupported

"meta-color-scheme" is not supported in this email client.

Outlook Android

Unsupported

"meta-color-scheme" is not supported in this email client.

Outlook for Mac

Unsupported

"meta-color-scheme" is not supported in this email client.

Apple Mail iOS

Unsupported

"meta-color-scheme" is not supported in this email client.

Yahoo Mail

Unsupported

"meta-color-scheme" is not supported in this email client.

Yahoo Mail Android

Unsupported

"meta-color-scheme" is not supported in this email client.

Yahoo Mail iOS

Unsupported

"meta-color-scheme" is not supported in this email client.

Samsung Mail

Unsupported

"meta-color-scheme" is not supported in this email client.

HEY Mail

Unsupported

"meta-color-scheme" is not supported in this email client.

Proton Mail

Unsupported

"meta-color-scheme" is not supported in this email client.

AOL Mail

Unsupported

"meta-color-scheme" is not supported in this email client.

Fastmail

Unsupported

"meta-color-scheme" is not supported in this email client.

Gmail Android

Partial

"meta-color-scheme" is not supported in this email client.

Gmail iOS

Partial

"meta-color-scheme" is not supported in this email client.

FAQ on meta-color-scheme in email

Why do I need both color-scheme and supported-color-schemes meta tags?

supported-color-schemes was the original vendor-neutral meta tag introduced for email clients; color-scheme is the standardized W3C tag. Including both ensures compatibility across older and newer client versions.

Can I force light mode only using meta color-scheme?

You can specify content="light", but aggressive clients like Gmail on Android may still auto-invert colors if the user's OS is set to dark mode.

Related Features

Check your own HTML for meta-color-scheme

Paste your own, or run the sample below. Analyzed in this page, with no signup and nothing stored.

Zero-Friction Engine Preview

Test your meta-color-scheme layout across 21 email clients

Preview rendering, catch CSS issues, and see how meta-color-scheme displays across Outlook, Gmail, and Apple Mail. Free, no account needed.

Instant live preview · No signup required · 21 email engines

Last tested upstream: · Last synced by Emailens:

caniemail.com (MIT) records Sep 16, 2026 as the last time meta-color-scheme was tested in a real client, less than a year before this sync. Syncing copies that result forward, it does not re-test it. Carried in @emailens/engine data v0.14.5.