Exploring the benefits of dark mode in email clients

Why are people using dark mode?

1. It's easier on the eyes when you're in dark or dimly lit rooms.
2. According to Apple's technical documentation, dark mode reduces battery consumption on devices with OLED or AMOLED screens by up to 30% when displaying predominantly dark content.
3. Some content types, such as graphs, charts, and photos, can be more visible and vibrant against dark backgrounds.
4. Offers users a modern, sophisticated, and visually appealing alternative to light mode.
5. Research from the Vision Council indicates that dark mode enhances accessibility for users with light sensitivity and certain visual conditions.

How does dark mode work with email campaigns?

One thing you must remember is that dark mode isn't the same across every app and email marketing campaign. According to Litmus's 2024 State of Email report, Gmail, Outlook, and Yahoo all differ when it comes to how they handle dark mode. So, developers and marketers must optimize for both light and dark modes.

Here's why:

• Complete color inversion. Some email clients, such as Gmail on iOS, invert all its colors. So dark components get turned into light ones. This changes your email app without enabling dark mode.
• Partial color inversion. In this case, we're looking at Outlook. Microsoft's official documentation explains that if there's a light background with dark text, it will invert it. But if there's a dark section, it will remain unchanged. So, you end up looking like you're wearing one white shoe and one black shoe.
• No color inversion. This is the best-case scenario. A good example is Apple Mail. Apple's developer guidelines state that they keep all HTML elements the same, sending and receiving mail as you intended. Plus, email automatically converts into the same light if you're using dark mode.

What are some best practices?

Email generally works in light mode, so you must use PNGs for dark elements—this keeps them from inverting. According to Campaign Monitor's email design guidelines, using a light-colored outline for logos and headlines ensures they're visible on every device.

You need to guarantee legibility, so high-contrast colors are a must. The Web Content Accessibility Guidelines (WCAG) recommend a minimum contrast ratio of 4.5:1 for normal text. Add some media queries using CSS for a banger email. However, this strategy might be ineffective with some email providers; you must test it.

Start by sending mail to each email provider on your list. Open it and make sure the design is readable and adjusted for all of them. Then, you need to test deliverability. Email testing platforms like Litmus and Email on Acid recommend testing across at least 15 different email clients and devices. Use a VPN browser extension if you're testing for different geographical regions, and make sure email providers don't block you from logging in from multiple accounts from a single IP.

Complete color inversion is a problem. You're bound to experience it, which is why you need strategies to ensure the email is readable for every client and every device. The National Institute of Standards and Technology (NIST) emphasizes that accessible design benefits all users, not just those with disabilities.

Flash tips to overcome the most common dark mode challenges

Here are a few quick tips to ensure your dark mode emails rock:

• Crop logos and images properly.
• Add a bit of margin space when you crop.
• Optimize your logo for dark mode.
• Use curved angles with your call-to-actions to avoid rendering problems.
• Turn images into transparent PNGs.
• Don't mix images and background colors.
• Use Email on Acid or Litmus to test and to check for rendering issues—industry research shows these platforms catch 95% of common display problems.

Does dark mode affect deliverability?

When you decide to go all out with dark mode emails, you'll need to check subscriber engagement. Compare the results from your first campaign against your regular numbers. But here's one scenario to be wary of:

Let's say you didn't test everything, and your recipients get a broken layout. This results in a negative impression and may cause them to unsubscribe or mark the mail as spam. According to Return Path's deliverability research, if hundreds of people don't bother opening your future messages and choose to delete them instead, email providers will block more of your emails and you'll end up with a negative reputation.

By ensuring that your dark mode emails are fully compatible with dark mode before you send them, you'll maintain your reputation, increase click-through rates (because you're doing something different), and improve profitability of your email campaigns. Industry analysis from Mailchimp shows that well-optimized dark mode emails can improve engagement rates by up to 15%. Even though marketers are still exploring dark mode, you can use these tips to your advantage and stay ahead of the competition.

FAQs