What is Dark mode and how to use it?

Dark mode is a color scheme option for user interfaces, applications, and operating systems that uses a darker color palette, usually with black or gray backgrounds and light text. This mode has gained popularity as it can reduce eye strain, save battery life, and provide a visually appealing experience for users. Many email clients and operating systems now support dark mode, altering the appearance of emails based on the user’s settings.

Dedicated Dark mode templates in GetResponse

GetResponse offers a few templates specially made to look good in dark mode. They are a great starting point if you want your message to look good in any mode and client.

To find a template compatible with dark mode, enter dark mode in a search option located on the right-hand side of the template selection screen.

dark email template selection

Dark mode preview

GetResponse offers a dark mode preview feature in the editor, allowing you to see how your message will look in dark mode. However, this preview may not accurately represent how your email will appear on every device or email client. Each operating system and email client has different rules for processing messages in dark mode, which can result in variations in appearance.

Dark Mode preview shall only be used as a reference, as it does not guarantee that the message will look as in preview for every dark mode recipient. We do recommend to always test your message by sending a test to a real email client, remembering that each client can render it differently.

To see the message preview in dark mode:

  1. When editing the message, click hover over Test and preview and click on Preview in the top, right corner of the screen.

    email preview
  2. Move the Dark mode preview slider in the top, right corner of the screen.

    dark mode preview

Common issues and how to solve them

  • Inverted colors: some email clients may invert the colors of your message, making it hard to read.
    To solve it, use transparent-background images instead of solid color images, and avoid using images with text.
  • Poor contrast: light text on a dark background may be difficult to read.
    To improve readability, increase the contrast between the background and text colors in the editor. That will assist email clients with maintaining proper contrast in dark mode as well.
  • Missing/invisible elements: elements (such as images) with dark colors may not be visible in dark mode if they are placed on a white background that is inverted to black by the email client.
    The simplest solution is to play with background colors, and the colors of the images used to achieve satisfactory contrast. Sometimes you might want to use an image with a non-transparent background so it is visible, if you want to avoid custom code.
  • Logo or image visibility issues: your logo might lack contrast to the dark mode’s background, especially if it has a transparent background.
    Example: adding black text in a PNG as a logo with white background would be still black text with transparent background on the now inverted black or gray background and that makes the logo not visible. 
    Solutions for this case can be: to use a different color of your logo; use a non-transparent background for the logo; custom code the message to adapt its colors to dark mode.