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
| Client | Category | Engine | Support |
|---|---|---|---|
| Gmail | webmail | Gmail Web | Unsupported |
| Gmail Android | mobile | Gmail Mobile | PartialSee caveat 1 |
| Gmail iOS | mobile | Gmail Mobile | PartialSee caveat 1 |
| Outlook 365 | webmail | Outlook Web | Unsupported |
| Outlook (New) | desktop | Outlook Web | Unsupported |
| Outlook Classic | desktop | Microsoft Word | Unsupported |
| Outlook iOS | mobile | Outlook Mobile | Unsupported |
| Outlook Android | mobile | Outlook Mobile | Unsupported |
| Outlook for Mac | desktop | WebKit | Unsupported |
| Apple Mail | desktop | WebKit | Supported |
| Apple Mail iOS | mobile | WebKit | Unsupported |
| Yahoo Mail | webmail | Yahoo | Unsupported |
| Yahoo Mail Android | mobile | Yahoo | Unsupported |
| Yahoo Mail iOS | mobile | Yahoo | Unsupported |
| Samsung Mail | mobile | Samsung | Unsupported |
| Thunderbird | desktop | Gecko | Supported |
| HEY Mail | webmail | WebKit | Unsupported |
| Proton Mail | webmail | Proton | Unsupported |
| AOL Mail | webmail | AOL | Unsupported |
| Fastmail | webmail | Fastmail | Unsupported |
| Superhuman | desktop | Blink | Unknown |
Documented caveats (1)
- 1.Gmail Android, Gmail iOS: Partial support. Only the value
light onlyis 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.
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.