Dark Mode Font Color When Using New Outlook for Windows
Hello,
Hopefully this is the correct Topic Channel to post this. Zendesk Support sent me your way as there's potentially HTML/CSS modifications needed. We're on the 'Support' Product and the ‘Team’ Plan and do not utilize web submissions for our end-user staff. Staff have to e-mail in tickets. When Agents are viewing the tickets in the web, via https://company.zendesk.com/agent, and use Dark Mode, replies from end-users who are running the new Outlook for Windows show up as black text on a dark grey background. This makes it difficult to read unless highlighting the text. Light mode works fine.
Here's Support's response. I just don't know where exactly in the E-mail Template I'm supposed to add that CSS code.
WHAT’S HAPPENING?
* Outlook Classic often uses inline styles or formatting that Zendesk's portal Dark Mode respects, showing white text on dark background.
* New Outlook for Windows tends to send replies with black font color explicitly set (inline CSS or HTML), which overrides Zendesk’s Dark Mode styling, causing black text on a dark background (hard to read).HOW TO ADDRESS THIS:
1. Encourage agents/users to avoid setting explicit black font color in new Outlook
* Use “Automatic” or default text color rather than forcing black.
2. Modify Zendesk’s Help Center [https://support.zendesk.com/hc/en-us/articles/4408839332250-Customizing-your-help-center-theme]
* Add CSS to override font colors inside replies when in Dark Mode, for example:
css
@media (prefers-color-scheme: dark) {
.zd-comment-content,
.zd-comment-content * {
color: #ffffff !important;
}
}
This forces reply text to white in Dark Mode regardless of inline styles.
3. Use Zendesk Liquid or email templates to standardize reply formatting
* Strip or override conflicting inline styles before emails are rendered in the portal (may require developer support).
4. Check Zendesk’s own Dark Mode settings
* You can review the Dark Mode settings in Zendesk using this guide - https://support.zendesk.com/hc/en-us/articles/9011095783322-Using-dark-mode-to-increase-agent-display-options
