Does Dark Mode Matter for Email Marketing?

What is dark mode and how does it impact your ability to succeed with email marketing? Find out in Zeta’s latest report.

What is dark mode?

Have you ever switched the background on your iPhone or Kindle from light to dark? If so—congratulations!—you’ve managed to use “dark mode” (sometimes called “night mode”) on your device. At the most basic of levels, dark mode is nothing more than a reverse color scheme when it comes to typography (the screen background is dark while the on-screen text is set in a lighter color). 

Basic look of dark mode on screen

Why does it matter for email?

At a high level, it matters because consumers are asking for it. Dark mode is an increasingly popular option for consumers looking to customize their content consumption experience. People believe it improves legibility, reduces eye strain, lessens eye fatigue, and mitigates exposure to melatonin-suppressing blue light (whether these beliefs are right or wrong is up for debate).

Therefore, the ability to accommodate dark mode is critical because it can make or break the user experience. If your creative looks good in dark mode, it’s going to help deliver a seamless brand experience. But if it doesn’t, your creative is going to deliver that fluid brand experience every marketer wants to offer.  

Speaking more tactically, dark mode is an accessibility feature that’s starting to take over consumer inboxes. For email marketers, that distinction means it’s critical to make a strategy adjustment (rather than try to override the function).

How is it handled by different email providers?

Right now, email providers handle it in one of three ways…

how dark mode is handled by email providers

With a UI Color Change, the ESP will only provide dark mode for their owned interface. In other words, your brand’s HTML email will look the same (the same light background with the same dark text) regardless of whether or not the recipient has dark mode enabled on their device.

UI Color Change for Dark Mode
UI Color Change

There is one caveat to a UI Color Change—if you’re sending a plain-text email, the ESP will likely flip your creative into dark mode.

With a Partial Color Change, you can expect the ESP to partially invert the colors of your email to suit the recipient’s device. What will the partial invert look like? In most instances, the email provider will automatically detect the areas of your email with a light background and flip them to a dark background, adjusting the text from dark to light along the way. 

The problem, of course, with a partial color change is that it leads to an incomplete design—photos, logos, stock images, and other key visuals within your message won’t match the rest of the aesthetic.

partial color change in dark mode
Partial Color Change

The third and final way in which email providers handle dark mode is with a Full Color Change

This method of accommodating dark mode is, by far, the most obtrusive to your brand because it—in effect—completely reverses the original design of your email. In other words, if your brand sends a dark-themed email to accommodate dark mode, and ESP using a Full Color Change protocol will automatically flip the color scheme to light. Similarly, if your brand sends a light-themed email not built to accommodate dark mode, the ESP will flip the color scheme to dark.

Full color change

What is the best way for marketers to deal with dark mode?

The best way for marketers to deal with dark mode is through better email design and development. Adjusting for it through design is going to be easier, less time consuming, and more predictable than any other strategy. Moreover, by making a dark-mode-friendly design, marketers like you become less reliant on product or platform updates.  

Dark mode can be targeted with its own set of styles throughout the email development process.

@media is very similar to how mobile is targeted with media queries—this will automatically target any UI that’s set to dark mode. 

data-ogsc and data-ogsb can target the Outlook app by simply duplicating the @media queries already in place, and adding an additional prefix (either data-ogsc and data-ogsb). 

As always, the best way to ensure your emails look great is through testing, especially given how frequently email providers update their platforms.

How Zeta helps

Zeta’s award-winning creative team can audit your email templates and recommend strategic improvements that will benefit your brand. We can also fix (or build from scratch) new dark-mode-safe templates that you can effortlessly implement at the drop of a hat. 

To learn more about the Zeta creative team and how we help clients create incredible email templates, contact us here.

Never miss a growth opportunity