{"id":20060,"date":"2020-09-11T10:55:02","date_gmt":"2020-09-11T14:55:02","guid":{"rendered":"https:\/\/www.litmus.com\/?p=20060"},"modified":"2024-08-22T11:23:08","modified_gmt":"2024-08-22T15:23:08","slug":"new-in-litmus-extended-dark-mode-testing","status":"publish","type":"post","link":"https:\/\/www.litmus.com\/blog\/new-in-litmus-extended-dark-mode-testing","title":{"rendered":"New in Litmus: Extended Dark Mode Testing"},"content":{"rendered":"\n\n\t
\n
\n \t
\n \t\t
\n \t\t\t
\n \t\t\t\t

Dark Mode is hot right now. It\u2019s ripe to be the defining trend of 2020\u2014outside of the pandemic and too many social issues to count\u2014and the subject of more blog posts and webinars than you can shake a stick at. At Litmus, we’ve spent the last few years educating people about dark mode in email with things like our Ultimate Guide to Dark Mode for Email Marketers<\/a>, Alice Li’s Litmus Live Day talk<\/a> on the subject, and some of Lily Worth’s trend hunting<\/a>.<\/p>\n

While we have supported Dark Mode testing<\/a> on some clients for a while, our latest release extends Dark Mode testing to both the Gmail App on Android 10 and iOS, as well as in Outlook.com on Chrome and Firefox. Here’s what you can expect from these popular clients.<\/p>\n

Dark Mode Support<\/h2>\n

In the past, we’ve identified three different levels of Dark Mode support across email clients:<\/p>\n

    \n
  1. No color changes<\/strong>, so there’s effectively no support.<\/li>\n
  2. Partial color invert<\/strong> that changes some colors while leaving others untouched.<\/li>\n
  3. Full color invert<\/strong> that swaps both light and dark backgrounds and text.<\/li>\n<\/ol>\n

    Additionally, some email clients support the CSS `prefers-color-scheme` property which allows you to override default Dark Mode color inversions and specify your own Dark Mode theme for your emails.<\/p>\n

    The Gmail App on Android 10, as well as Outlook.com on both Chrome and Firefox, do a partial color invert. Light background colors are swapped to dark, with dark text switching to light. However, darker backgrounds\u2014like CTAs\u2014preserve their original colors.<\/p>\n\"\"\n

    On iOS, the Gmail App appears to do a full color invert in Dark Mode, swapping out not only the background and text colors but darker colors on elements like CTAs.<\/p>\n\"\"\n

    Unfortunately, unlike recent versions of Apple Mail and a few other email clients on MacOS, neither client supports `prefers-color-scheme`, so email designers are left with limited support for achieving ideal Dark Mode designs. This seems to be par for the course right now with email clients but, hopefully, we\u2019ll see increased support for CSS-controlled Dark Mode styling in the future.<\/p>\n

    On the brighter side (pun intended), our latest email client additions don\u2019t introduce any significant changes to rendering. You can keep using your tried-and-true design techniques to create beautiful, functional, and accessible campaigns without any additional effort.<\/p>\n

    Design for Dark Mode<\/h2>\n

    As the latest additions to our Email Previews testing suite show, it\u2019s important for email designers to consider how their emails will display in both Light and Dark Mode scenarios. While it\u2019s tempting to just design for the Light Mode and move onto the next task, you should consider a few things which we previously noted in our Ultimate Guide to Dark Mode for Email Marketers<\/a>.<\/p>\n

      \n
    1. Images and logos should be optimized for both Dark and Light Modes. Use transparent PNGs for non-rectangular images so that there aren\u2019t unsightly white backgrounds and add a slight white shadow to images with dark text to keep them readable in Dark Mode.<\/li>\n
    2. Use high contrast text and background colors so that, even when partial and full color inverts happen, your message is still readable.<\/li>\n
    3. Test! Test your campaigns across as many email clients and settings as possible to ensure that your message gets across to subscribers, regardless of their personal device settings.<\/li>\n<\/ol>\n

      Start Testing Today<\/h2>\n

      We have Dark Mode support for over 10 clients, as well as dozens of other popular clients. . You can start Litmus email QA<\/a> testing in all of the 90+ email clients today inside of Litmus.<\/p>\n

      Not a Litmus customer? Sign up for a free 7-day trial<\/a> and start sending better emails today.<\/p>\n \t\t\t<\/div>\n \t\t<\/div>\n \t<\/div>\n <\/div>\n<\/div>\n","protected":false},"excerpt":{"rendered":"

      While we have supported Dark Mode testing on some clients for a while, our latest release extends Dark Mode testing to both the Gmail App on Android 10 and iOS, as well as in Outlook.com on Chrome and Firefox. Here’s what you can expect from these popular clients.<\/p>\n","protected":false},"author":17,"featured_media":20071,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_acf_changed":false,"footnotes":""},"tags":[809,106,10254],"blog_category":[61,549],"class_list":["post-20060","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","tag-dark-mode","tag-gmail","tag-preview","blog_category-features-updates","blog_category-product"],"yoast_head":"\nNew in Litmus: Extended Dark Mode Testing - Litmus<\/title>\n<meta name=\"description\" content=\"While we have supported Dark Mode testing on some clients for a while, our latest release extends Dark Mode testing to both the Gmail App on Android 10 and iOS, as well as in Outlook.com on Chrome and Firefox. Here's what you can expect from these popular clients.\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/www.litmus.com\/blog\/new-in-litmus-extended-dark-mode-testing\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"New in Litmus: Extended Dark Mode Testing\" \/>\n<meta property=\"og:description\" content=\"While we have supported Dark Mode testing on some clients for a while, our latest release extends Dark Mode testing to both the Gmail App on Android 10 and iOS, as well as in Outlook.com on Chrome and Firefox. Here's what you can expect from these popular clients.\" \/>\n<meta property=\"og:url\" content=\"https:\/\/www.litmus.com\/blog\/new-in-litmus-extended-dark-mode-testing\" \/>\n<meta property=\"og:site_name\" content=\"Litmus\" \/>\n<meta property=\"article:publisher\" content=\"https:\/\/www.facebook.com\/litmusapp\" \/>\n<meta property=\"article:published_time\" content=\"2020-09-11T14:55:02+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2024-08-22T15:23:08+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/www.litmus.com\/wp-content\/uploads\/2020\/09\/extended-dark-mode-post.png\" \/>\n\t<meta property=\"og:image:width\" content=\"1380\" \/>\n\t<meta property=\"og:image:height\" content=\"724\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/png\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:creator\" content=\"@litmusapp\" \/>\n<meta name=\"twitter:site\" content=\"@litmusapp\" \/>\n<!-- \/ Yoast SEO Premium plugin. -->","yoast_head_json":{"title":"New in Litmus: Extended Dark Mode Testing - Litmus","description":"While we have supported Dark Mode testing on some clients for a while, our latest release extends Dark Mode testing to both the Gmail App on Android 10 and iOS, as well as in Outlook.com on Chrome and Firefox. Here's what you can expect from these popular clients.","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/www.litmus.com\/blog\/new-in-litmus-extended-dark-mode-testing","og_locale":"en_US","og_type":"article","og_title":"New in Litmus: Extended Dark Mode Testing","og_description":"While we have supported Dark Mode testing on some clients for a while, our latest release extends Dark Mode testing to both the Gmail App on Android 10 and iOS, as well as in Outlook.com on Chrome and Firefox. Here's what you can expect from these popular clients.","og_url":"https:\/\/www.litmus.com\/blog\/new-in-litmus-extended-dark-mode-testing","og_site_name":"Litmus","article_publisher":"https:\/\/www.facebook.com\/litmusapp","article_published_time":"2020-09-11T14:55:02+00:00","article_modified_time":"2024-08-22T15:23:08+00:00","og_image":[{"width":1380,"height":724,"url":"https:\/\/www.litmus.com\/wp-content\/uploads\/2020\/09\/extended-dark-mode-post.png","type":"image\/png"}],"twitter_card":"summary_large_image","twitter_creator":"@litmusapp","twitter_site":"@litmusapp","schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/www.litmus.com\/blog\/new-in-litmus-extended-dark-mode-testing#article","isPartOf":{"@id":"https:\/\/www.litmus.com\/blog\/new-in-litmus-extended-dark-mode-testing"},"author":{"name":"","@id":""},"headline":"New in Litmus: Extended Dark Mode Testing","datePublished":"2020-09-11T14:55:02+00:00","dateModified":"2024-08-22T15:23:08+00:00","mainEntityOfPage":{"@id":"https:\/\/www.litmus.com\/blog\/new-in-litmus-extended-dark-mode-testing"},"wordCount":7,"commentCount":0,"publisher":{"@id":"https:\/\/www.litmus.com\/#organization"},"image":{"@id":"https:\/\/www.litmus.com\/blog\/new-in-litmus-extended-dark-mode-testing#primaryimage"},"thumbnailUrl":"https:\/\/www.litmus.com\/wp-content\/uploads\/2020\/09\/extended-dark-mode-post.png","keywords":["Dark Mode","Gmail","Preview"],"inLanguage":"en-US","potentialAction":[{"@type":"CommentAction","name":"Comment","target":["https:\/\/www.litmus.com\/blog\/new-in-litmus-extended-dark-mode-testing#respond"]}]},{"@type":"WebPage","@id":"https:\/\/www.litmus.com\/blog\/new-in-litmus-extended-dark-mode-testing","url":"https:\/\/www.litmus.com\/blog\/new-in-litmus-extended-dark-mode-testing","name":"New in Litmus: Extended Dark Mode Testing - Litmus","isPartOf":{"@id":"https:\/\/www.litmus.com\/#website"},"primaryImageOfPage":{"@id":"https:\/\/www.litmus.com\/blog\/new-in-litmus-extended-dark-mode-testing#primaryimage"},"image":{"@id":"https:\/\/www.litmus.com\/blog\/new-in-litmus-extended-dark-mode-testing#primaryimage"},"thumbnailUrl":"https:\/\/www.litmus.com\/wp-content\/uploads\/2020\/09\/extended-dark-mode-post.png","datePublished":"2020-09-11T14:55:02+00:00","dateModified":"2024-08-22T15:23:08+00:00","description":"While we have supported Dark Mode testing on some clients for a while, our latest release extends Dark Mode testing to both the Gmail App on Android 10 and iOS, as well as in Outlook.com on Chrome and Firefox. Here's what you can expect from these popular clients.","breadcrumb":{"@id":"https:\/\/www.litmus.com\/blog\/new-in-litmus-extended-dark-mode-testing#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/www.litmus.com\/blog\/new-in-litmus-extended-dark-mode-testing"]}]},{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/www.litmus.com\/blog\/new-in-litmus-extended-dark-mode-testing#primaryimage","url":"https:\/\/www.litmus.com\/wp-content\/uploads\/2020\/09\/extended-dark-mode-post.png","contentUrl":"https:\/\/www.litmus.com\/wp-content\/uploads\/2020\/09\/extended-dark-mode-post.png","width":1380,"height":724},{"@type":"BreadcrumbList","@id":"https:\/\/www.litmus.com\/blog\/new-in-litmus-extended-dark-mode-testing#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/www.litmus.com\/"},{"@type":"ListItem","position":2,"name":"New in Litmus: Extended Dark Mode Testing"}]},{"@type":"WebSite","@id":"https:\/\/www.litmus.com\/#website","url":"https:\/\/www.litmus.com\/","name":"Litmus","description":"Are you getting the most out of your email marketing?","publisher":{"@id":"https:\/\/www.litmus.com\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/www.litmus.com\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"en-US"},{"@type":"Organization","@id":"https:\/\/www.litmus.com\/#organization","name":"Litmus Software","url":"https:\/\/www.litmus.com\/","logo":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/www.litmus.com\/#\/schema\/logo\/image\/","url":"https:\/\/www.litmus.com\/wp-content\/uploads\/2025\/04\/featured-image.png","contentUrl":"https:\/\/www.litmus.com\/wp-content\/uploads\/2025\/04\/featured-image.png","width":600,"height":314,"caption":"Litmus Software"},"image":{"@id":"https:\/\/www.litmus.com\/#\/schema\/logo\/image\/"},"sameAs":["https:\/\/www.facebook.com\/litmusapp","https:\/\/x.com\/litmusapp"]},{"@type":"Person","@id":""}]}},"acf":[],"_links":{"self":[{"href":"https:\/\/www.litmus.com\/wp-json\/wp\/v2\/posts\/20060","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.litmus.com\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.litmus.com\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.litmus.com\/wp-json\/wp\/v2\/users\/17"}],"replies":[{"embeddable":true,"href":"https:\/\/www.litmus.com\/wp-json\/wp\/v2\/comments?post=20060"}],"version-history":[{"count":1,"href":"https:\/\/www.litmus.com\/wp-json\/wp\/v2\/posts\/20060\/revisions"}],"predecessor-version":[{"id":100757,"href":"https:\/\/www.litmus.com\/wp-json\/wp\/v2\/posts\/20060\/revisions\/100757"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.litmus.com\/wp-json\/wp\/v2\/media\/20071"}],"wp:attachment":[{"href":"https:\/\/www.litmus.com\/wp-json\/wp\/v2\/media?parent=20060"}],"wp:term":[{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.litmus.com\/wp-json\/wp\/v2\/tags?post=20060"},{"taxonomy":"blog_category","embeddable":true,"href":"https:\/\/www.litmus.com\/wp-json\/wp\/v2\/blog_category?post=20060"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}