Skip to main content

Does anyone know how I can avoid background colors changing in dark mode? For example, if I want the content area background area to be white, how can I set it so it's also white when showing up in dark mode and not flip to black? I notice other email campaigns have achieved this so wondering if there is a way to do this in Iterable or if they must have created those templates elsewhere.

  1. You can play with adding a gradient and then setting an opacity on the background. That works in some cases, but I'm unsure if it will work on a white background (our normal background is dark so little different). Sample: background-color: #000000; background-image: linear-gradient(#000000, #000000); opacity:0.9999"


  2. This isn't going to work on all devices which we decided we were fine with because our audience is unlikely to be using those other devices.


  3. It's also possible those other companies are using images. If you want to share code from one of them I'd be happy to take a look and see how they're accomplishing it.


  4. I'm sorry for this last part but I have to say it: If your background is white, you should consider the user experience of forcing it to be white in dark mode. We use the above work around because our background is dark in light mode, so the experience of it going light when in dark mode sucks for users. But if our background was white, we'd want to allow the user control of making it dark as not to go against their preferences. Not telling you what to do here, but it is something to consider. If the reason you're making the call is because some senior executive doesn't want the email to look different, it might be worth educating them. But if it's just how it's got to be, I get it and hope the above helps.


Reply


Terms & ConditionsCookie settings