Optimizing Email for Dark Mode

Screens everywhere are going back to black as dark mode surges in popularity.

Developers, designers, and marketers are adapting their content, emails, websites, and applications to create a “dark mode” experience to cater to the growing preference for darker themes and interfaces. As more users are opting for this color scheme, content that isn’t optimized for dark mode can be jarring – and frustrating.

Dark mode is more than a passing trend of individual preferences – it’s changing the  way we experience email.

Are you ready to embrace the dark side (or mode) of email and evolve to meet the rising user preference? We’re illuminating what dark mode is, why subscribers are making the switch, and how you can enhance your campaigns to deliver dark-mode-friendly email experiences.

Welcome to the Dark Side: Understanding Dark Mode

Litmus defines dark mode as a “reversed color scheme utilizing light-colored typography, user interface (UI) elements, and iconography on dark backgrounds.”

Dark mode seems to be trending everywhere, especially when it comes to smartphone apps and email. Windows 10 was at the forefront of starting the trend in late 2018, but Apple’s recent dark mode release for iOS quickly converted millions of iPhone users to the dark side. It may seem like a trending aesthetic preference, but other industry heavyweights are following suit and you should too.

Why go to the dark side? Dark mode themes reduce the amount of light given off by screens, while still meeting minimum color contrast ratios for optimal legibility and accessibility requirements. As a result, many users are embracing the hot UI trend because dark mode:

  • Improves visual ergonomics by reducing eye strain and fatigue
  • Conserves battery power and extends screen lifespan of devices
  • Allows users to adjust brightness and contrast when in low-light environments
  • Improves content readability and legibility
  • Reduces screen glare and helps with light sensitivity

Dark Mode and Email: Getting Started

Dark mode is taking over the inbox. With major email platforms such as Gmail, Apple Mail, and Outlook enabling dark mode, the hot tech trend is adding an additional layer to the world of email design. As a result, email marketers need to provide a superior experience by catering to both light and dark audiences simultaneously.

With mobile accounting for 46 percent of all email opens, it’s critical for email marketers to take notice. If you’re not designing your emails for this new look, you run the risk of standing out—in a bad way. Light, bright emails and images can be startling and create alarming experiences when they suddenly appear in an otherwise soothing dark environment.

Here are a few tips and tricks to deliver an email experience that’s optimized for both light and dark display preferences. (Hint: it doesn’t mean doubling your work!)

1. Optimize your logo. Design a light mode and a dark mode (or “reverse”) version of your company logo and icons. If you prefer to keep your logo consistent across environments, include a “stroke” or outline to keep it from disappearing against a dark background.

2. Be transparent when possible. Use transparent imagery or .pngs to avoid unwanted background colors in dark mode renderings. Be aware of images or icons that are too dark to stand out and adjust so they don’t get lost in the background. Conversely, when not using transparent images, make sure there is enough padding to avoid an awkward juxtaposition or spacing.

3. Be mindful of color. From the background to foreground, to call-to-action buttons and font colors, implement a dark mode preferred color scheme for more control over design. Create a color palette with standard brand colors and their dark equivalent for consistency and a seamless experience for dark and light users alike.

4. Soften the strain. When possible, avoid using pure black (#FFFFFF) and pure white (#000000) for large paragraphs of text. This color combination actually leads to increased eye strain. Instead, use light and dark shades of gray or a similar color to create the most pleasant user experience that’s easy on the eyes.

5. Check your contrast. Carefully select darker background colors and lighter foreground colors to meet proper contrast and accessibility standards, while avoiding overly saturated colors that are jarring or cause visual vibration. Evaluate legibility by checking for poor text–background color combinations and confirm that your content isn’t disappearing in the dark.

6. Don’t guess, test. Email clients are constantly changing and introducing new complexities in light of new features and changing subscriber preferences like dark mode. Nevertheless, only 57% of marketers test every email they send, and the other 43% take the risk of having email nightmares. Silence your send anxiety, using a tool like Litmus, to test and tweak every email to ensure that it’s rendering properly across clients and devices in light vs. dark appearances.

Don’t Get Left in the Dark

With more and more subscribers opting to utilize their email service provider’s dark themes, email marketers must enhance their messages for both the light and dark side.

While making sure your emails look great in this increasingly popular reading environment presents new challenges, delivering dark-mode-friendly experiences doesn’t have to be overwhelming or time-consuming. Get started by optimizing your logos, iconography, colors, and text to reduce reader frustration and ensure a seamless subscriber experience. And, as always: test, test, test!

Still afraid of the dark? Get in touch with our team of email experts to elevate your email content and designs for dark mode.