Dark Mode for Email Simulator
Dark mode is the big topic for email marketers and designers in 2020. Dark mode first came to iOS, which limited the exposure of users to dark mode. However, ever since Gmail supported dark mode with the introduction in Android 10, marketers everywhere have been fretting how their email looks when rendered in applications that support dark mode.
Dark Mode Simulator
At ProofJump, we created a Dark Mode for Email Simulator that will mimic what you see in your email when rendered in dark mode by inverting the colors and fonts.
This way you can quickly gauge how an email you designed will look with its colors inverted and whether this would affect the legibility of your email.
Why The Tool Was Created
This tool was built because although there are many articles about dark mode in email such as this great article by Alice Li, many email marketers still can’t envision the effect dark mode has on their email.
Using the Tool
- Paste the source of your email in the tool and click the Process button. You will now see the normal view of your email. To see the dark-mode-rendered version, click on the Dark Mode toggle.
- To see the email in a larger view, click on the “view in full screen” button. Now you can edit the code and view the dark mode rendered view side by side.
If you’re interested in seeing how other emails in your inbox render in Dark Mode, check out our Email Source Converter tool, which will allow you to get the source of your email from Gmail, Yahoo! Mail or Outlook.com.
What the Tool Does
This tool mimics the “full invert” scheme of Gmail in iOS – one of the most popular email clients. Wherein:
- Text and background colors are inverted – so light colors become dark and dark colors become light.
- Images, including background images, are not converted, hence they stay the same.
With this tool, you are able to detect places where, for example, you originally have light text over a dark background image and then find out that in dark mode, your text will turn dark while the background will remain dark, making your recipients unable to read the text.
It will also show you if your logo and icons lose contrast when your email is read in dark mode.
Many Kinds of Dark Mode
The unfortunate truth is that many email clients who support dark mode transform emails differently. Although the Gmail client for iOS does a “full invert” in colors, clients such as Gmail for Android as well as Outlook and the native iOS Mail clients only do selective color inversion.
Generally, clients that do selective color inversion will only make light background colors darker while making dark text lighter and not vice versa.
With selective color inversion, you may sometimes end up with the client converting a light background to a dark color while not converting the text within to a light color, rendering the email unreadable. This is something you can only find out by testing on a real email client or by using an email-rendering service like Email on Acid or Litmus.
The utility of the dark mode for email simulator is to give you a quick glance at what issues may occur in your email but not go through all possible dark mode scenarios.
Proofing Email Campaigns
While we are on the subject of checking emails, if you are struggling with campaign QA and reviews, check out ProofJump. ProofJump gives you a single place to get feedback and approvals on your email campaigns.
