← CSS Support IndexDoes CSS
Does CSS light-dark() Work in HTML Email?
Enables setting two colors (one for light and the other for dark mode) for a property.
Quick Answer
Does light-dark() work in HTML email?
The CSS light-dark() property is supported in Apple Mail, Thunderbird, ProtonMail. It is NOT supported in Gmail, Outlook (Windows), Outlook (Mac / Web), and others. Always include a safe fallback for unsupported clients.
Which Email Clients Support CSS light-dark()?
CSS support for light-dark() across email clients
| Email Client | Desktop | Mobile / Web | Notes |
|---|---|---|---|
| Gmail | ✗ No | ✗ No | — |
| Outlook (Windows) | ✗ No | ? | — |
| Outlook (Mac / Web) | ✗ No | ✗ No | — |
| Apple Mail | ✓ Yes | ✓ Yes | — |
| Yahoo! Mail | ✗ No | ✗ No | — |
| Samsung Email | ? | ~ Partial | — |
| Thunderbird | ✓ Yes | ? | — |
| ProtonMail | ~ Partial | ✓ Yes | — |
| Fastmail | ? | ? | — |
Notes
- #1 Only supported if you’ve updated your OS with Safari 17.5 or later.
- #2 Buggy. The function is supported but the color stays light even in dark mode.
- #3 Partial. Not supported with Hotmail/Outlook accounts.
Frequently Asked Questions
Related CSS Properties
Test Your Email Now
Paste your HTML and see how it renders in clients that don't support light-dark().
Building a new email instead of checking an existing one? MailViewr's Email Builder only lets you use CSS that's known to render across clients, so light-dark() can't sneak into your markup by accident. Open the Email Builder →