🕶️ Dark Mode Emails: Must-Know Design Hacks

Hey, it’s Ray.

Let’s talk about something I’ve been experimenting with a lot lately, dark mode emails.

If you’re anything like me, you probably switch your apps and inbox to dark mode at night. 

It’s easier on the eyes, right? 

But here’s the catch…

Your emails might not be looking as good as you think in dark mode.

When I first noticed this, I was shocked. 

An email that looked clean and professional in light mode suddenly looked messy, hard to read, and totally off-brand in dark mode. 

And guess what? A LOT of brands are missing this.

Dark mode isn’t just a cool feature people switch on for fun, it’s becoming the default for millions of users. 

According to Litmus, over 50% of emails are now opened in dark mode. 

That means if your emails aren’t optimized for both light and dark modes, you’re losing engagement (and maybe sales).

I’ve been tweaking and testing different approaches to make sure my emails look flawless no matter which mode my subscribers use. 

Today, I’m sharing the best hacks I’ve learned so far.

Why Dark Mode Matters More Than You Think

Here’s how it works:

✅ User Preference is Shifting
People love dark mode because it’s easier on the eyes, reduces glare, and saves battery life. 

When users are more comfortable, they’re more likely to engage with your content.

✅ Bad Formatting Hurts Your Brand
Ever seen a brand’s logo disappear on a dark background?

Or worse, text that blends into the background? 

A poorly formatted email in dark mode can make you look unprofessional.

✅ Email Clients Handle Dark Mode Differently
Gmail, Apple Mail, Outlook… all render dark mode a little differently. 

Some invert colors, some adjust logos, and others tweak background shades. 

If you’re not testing across platforms, you’re flying blind.

When I realized how many variables were at play, I knew I had to figure out a foolproof way to make emails look great everywhere. 

So, I started testing.

What I’ve Learned: My Top Dark Mode Email Hacks

After A/B testing countless emails (and driving my design team crazy), I’ve cracked the code on making emails that look amazing in both light and dark mode.

1. Use Transparent PNGs for Logos and Images

One of the biggest issues I ran into? 

Logos and images disappearing on dark backgrounds.

Solution: Always use transparent PNGs for logos and icons. 

This prevents that awkward white box from showing up and makes your images blend seamlessly with any background.

I also make sure the logo has enough contrast in both light and dark modes to stay visible, because trust me, a hidden logo is a missed branding opportunity.

2. Avoid Pure Black and Pure White

Here’s a pro tip I learned the hard way: Pure black (#000000) and pure white (#FFFFFF) don’t adapt well in dark mode.

Instead, I use:

• Dark gray (#121212) for dark mode backgrounds
  

• Soft off-white (#F9F9F9) for light mode backgrounds
  

This keeps the contrast balanced without creating harsh transitions that can mess with readability.

3. Double-Check Button Contrast

Another mistake I was making? 

CTA buttons disappearing in dark mode.

To fix this, I:

• Use high-contrast button colors that stand out in both light and dark modes.
  

• Add a subtle border to buttons so they don’t fade into the background.
  

I always test my CTAs on multiple devices and clients to make sure they’re impossible to miss.

4. Test Across Multiple Platforms (Don’t Skip This!)

This is where a lot of brands slip up.

Different email apps handle dark mode in their own way, which means what looks perfect in one might look off in another.

That’s why I always test my emails across multiple platforms to make sure everything looks consistent, no matter where it’s opened. 

It’s the best way to catch any surprises before hitting send.

Mistakes I’ve Learned to Avoid

Of course, I’ve had my fair share of “facepalm” moments along the way. 

Here’s what NOT to do:

❌ Forgetting to Check Preheader Text
Preheader text that’s too light can disappear on a dark background. 

I always make sure it has enough contrast to be visible in both modes.

❌ Using Background Images Without Fallbacks
Background images can get inverted or look weird in dark mode. 

Now, I always include a solid fallback background color just in case.

❌ Overloading Emails with Too Many Images
Dark mode can be unpredictable with image-heavy emails. 

I stick to a clean, text-first approach with only essential visuals.

Which Email Apps Use Dark Mode?

Okay, let’s talk about where dark mode actually works.

Lots of email apps and programs now let people switch to dark mode. 

Some do it automatically based on the user’s settings, while others let them choose manually.

Here’s a quick list of where dark mode is available:

Mobile Apps

• iPhone Mail

• iPad Mail

• Gmail App (Android)

• Gmail App (iOS)

• Outlook App (Android)

Desktop Programs

• Apple Mail

• Outlook 2021 (Mac and Windows)

• Office 365 (Mac and Windows)

• Windows Mail

Web-Based Clients

• outlook.com

But here’s the tricky part…

Just because these apps and programs support dark mode doesn’t mean your emails will always look right. 

Email design can be unpredictable.

An email that looks perfect in one app can look completely off in another. And when you add dark mode into the mix? 

It gets even more complicated.

Different apps handle dark mode in different ways, which means if you’re not testing across platforms, you’re flying blind. 

Don’t worry, I’ve got some tips coming up to help make sure your emails shine no matter where they’re opened.

Why Dark Mode Optimization Is Worth It

When I started paying attention to dark mode, I didn’t expect the results to be so drastic.

But after optimizing, I noticed:

✅ Higher open and click-through rates
✅ Fewer unsubscribes (because the experience was smoother)
✅ Better overall engagement

And the best part? 

Dark mode optimization is a one-time effort that keeps paying off.

Want to Master Email Marketing? Let’s Do This.

If this sounds like a lot to manage, don’t worry, I’ve got you covered.

There’s a lot that goes into building a high-converting email strategy. 

If you’re serious about optimizing your email marketing, let’s talk. 

Here’s what we can do:

✅ Done-for-You Email Strategy: If you’re ready to scale but don’t have the time, we’ll build out a full email system that maximizes your revenue. You can book a call with me here. 

✅ Or, if you just want to grab a free resource, get a FREE 10-page KPI audit and a 128-point health scorecard to optimize your email marketing. Get it here!

More Ways to Level Up Your Email Game

If you’re up about boosting your email game, I’ve got a few more gems for you:

📺 Watch My Latest YouTube Video!

Want to create stunning, high-converting emails in Figma for Klaviyo? In this step-by-step tutorial, I’ll show you how to design emails that look amazing and drive results, perfect for Shopify and Klaviyo users. 👉 Watch it here!

🎨 Build a Strong Brand with Consistent Email Templates

Is your email design all over the place? A lack of consistency can confuse your audience and weaken your brand identity.

Our lead email designer, Kristine Gabayron, has shared expert tips on designing email templates that align with your brand and create a cohesive customer experience. Want to ensure your emails look polished and professional every time? 

👉 Read the blog here to master the art of consistent branding!

💡 Let’s Connect on LinkedIn
I share daily email marketing tips, behind-the-scenes insights, and strategies that actually work. If you’re looking for extra value beyond this newsletter, let’s connect!👉  Follow me here.