Re: How to Implement Light/Dark Mode in Marketo Email 3.0 Editor Using Custom CSS?

anandrajs786

Hi Marketo Community,

We’re building an email template in the new Email Editor 3.0 and need to support light/dark mode based on the user’s device preference. While we know this can be achieved with CSS media queries (e.g., @media (prefers-color-scheme: dark)),

we’re unable to find a way to:

Inject Custom CSS into the entire template or specific modules.
Edit the HTML Head to add global styles (unlike in Legacy Editor).
Override Default Styling for dark mode (e.g., dark backgrounds, inverted text/images).

Example Use Case:

Light Mode: White background + dark text.
Dark Mode: Black background + light text

Challenges:

The new editor restricts direct HTML/CSS access for modules.
Dynamic content rules don’t seem to support device-level preferences.

Questions:

Is there a workaround to add custom CSS in Email 3.0 (e.g., via Template SDK, hidden modules)?
How are others handling dark mode compatibility in the new editor?
Are there planned features to support this natively?

We’d appreciate any code snippets, hacks, or official guidance!

Thanks,

NiharikaGoyal

Hi @anandrajs786

Hope you are doing well.

As in new editor You can’t edit the global <head>, but you can use raw HTML module to inline CSS styles and try embedding <style> tags inside <div> (some clients support it).

Here are some suggestions:

1) You can use light borders around images so that these should be highlighted in dark mode.

2) You can use color branding in such a way so that in dark mode it automatically render fine.

Also, as of now, Adobe hasn’t publicly confirmed a timeline for native dark mode support in Email 3.0.

Hope that would helpful.

Thanks!!

Dave_Roberts

@anandrajs786 -- I heard there was a lot of hype around the new email editor at Summit, but this tool is a long way from "production-capable" at the moment. It might make more sense to hold off on creating templates until they've actually got the kinks worked out and you're actually able to use these emails in Programs. I'm not sure why Adobe released and hyped up a half-baked version of the new email editor but maybe it was just to give everyone a chance to play around in the tool before it's actually ready for real-life use.
If this ends up being anything like the email 2.0 rollout it'll be a year or two before the major issues with the tool are worked out and a stable version is released and ready for production. I've seen that there are plans to make updates in Q2 and Q3 this year so that's at least another 6 months of changes before the bugs and lacking functionality of today's tool are worked out and updated.

For my money, I'd guess something closer to 2026 or early 2027 for a stable release before I take this seriously enough to think about replacing the EM 2.0 templates that actually work in today's world.