Email not showing up correctly when sent to Gmail with dark mode on

  • 19 February 2023
  • 1 reply

Badge +1


Currently building out flows right now that have been designed in figma. For deliverablity purposes, I don’t want to import the entirety of the design in image blocks but as well add some text blocks within klaviyo. 

The design of the email is black and so the image blocks are black. When I add text blocks and make the background black, whenever it’s sent to a customer who is using gmail and they have dark mode on, the background of the text block inverts into white and the image blocks stay black which completely ruins the aesthetic and flow of the email. 

Anyone come across this problem and know how to fix it? Should I just add everything as image blocks and risk deliverability? 


Best answer by stephen.trumble 21 February 2023, 18:48

View original

1 reply

Userlevel 7
Badge +60

Hey @StevensCopy 

Thank you so much for reaching out for help with your templates in dark mode.

Dark Mode can be challenging to design for because inbox providers like Gmail & Outlook, as well as email applications (Apple Mail, Android apps, etc.) all handle Dark Mode differently. Some email clients will invert colors, while others will simply change all colors darker. Ultimately, dark mode changes are rendered once the email is already compressed, sent out of Klaviyo, and exists within the inbox of the email client. Because the changes occur once the email has already been sent out of Klaviyo, there are a limited number of changes you can make within Klaviyo to alleviate dark mode rendering, which you have already done by using text blocks. 

All that said, we understand that dark mode can be frustrating, as it decreases control over the way your email displays in a recipient's inbox. It's important to keep in mind that all recipients using Dark Mode have selected this setting intentionally, and to circumvent the dark mode setting would go against their preferences.
For more information on this, please see some related content below:

Hope this helps! Thanks again for being part of the Klaviyo Community!