Skip to content

Email signature logo disappears in dark mode? How to fix it

Why a transparent logo vanishes in dark mode, what Microsoft documents, what vendor tests show, and how to check your signature before you send it.
The Sendoff team3 min read

A dark logo on a transparent background often disappears when the reader's inbox switches to dark mode, because the background behind it turns dark too. Fix the image first: put the logo on a solid tile, add a thin light edge to dark parts, and check the signature in a dark inbox before you send it to your team. Microsoft does not document how signatures behave in dark mode, so the test step matters.

Why the logo vanishes

A transparent PNG has no background of its own. Whatever sits behind it shows through. When a message is displayed on black, dark ink in the logo sits on black and cannot be seen. Nothing is wrong with your HTML. The colours simply clash.

Dark mode is not one setting, and each app handles it differently:

  • Classic Outlook for Windows can use a black Office theme. Microsoft's Dark Mode page describes it as providing "a black background (instead of white) for the message window."
  • New Outlook has an appearance setting under Settings, General, Appearance. A reader can also light up one message with the Turn on the lights button in the reading pane.
  • Outlook on the web follows the same Settings, General, Appearance path.
  • Outlook for Android and iOS do not convert images in emails to dark colours, according to Microsoft's help article. An image keeps its original colours on whatever background the app uses.

Your recipients choose these settings, not you. So the logo has to work on both a white and a dark background.

Design the logo for both backgrounds

  1. Put the logo on a solid tile. Export the logo with its own background colour, such as a white square with some padding around the mark. Vendor guides recommend this, but Outlook does not document it as a feature, so test it.
  2. Add a thin light edge to dark shapes and letters. Vendor guides suggest a stroke of about 1 to 2 px in a light colour around dark elements. Add it in your image editor, not in the HTML.
  3. Keep your name and phone number as live text. Text stays readable when pictures are blocked, and recipients can copy it. Only the logo should be an image.
  4. Do not depend on a second logo for dark mode. Some guides suggest serving a light logo through the prefers-color-scheme media query. Vendor tests report that Apple Mail honours it, while Outlook 365 and Gmail on iOS ignore it and show the fallback. The fallback therefore has to be readable on a dark background anyway.

The white box around a transparent logo

Some vendors report that classic Outlook puts a white box behind a transparent PNG in dark mode. The Xink support article, last updated on 12 April 2026, says Outlook's dark mode "applies its own background rendering" that can override transparency in images. Its fix is to place the image inside a one-row, one-cell table with border, cellpadding and cellspacing set to 0.

Microsoft's pages do not mention this behaviour. Treat it as a report to test on your own Outlook build, not as a confirmed bug.

Test in a dark inbox before you roll it out

  1. Send the signature to three addresses: a Gmail account, an Outlook account and a mailbox you open on your phone.
  2. Turn on dark mode in each app. In classic Outlook for Windows, go to File, Office Account, Office Theme, then choose Black.
  3. Open each message and check the edges of the logo and the small print.
  4. Reply to one of the messages. The signature then sits below quoted text, so check it there too.
  5. If the logo fades, try the solid tile or the light edge, send a new test, and repeat.

How Sendoff handles this

The signature preview has an inbox switch with a moon icon. Turn it on to invert the colours in the preview so you can spot a dark logo before you send it. It is a rough check, not a copy of how Outlook or Gmail render a message, so the test above still applies. Build the layout in the free email signature generator, check it with the toggle, then send it to a real inbox. The glossary entry on dark mode inversion explains the terms used here.

Sources

Make yours now

Every Sendoff template is built to the rules in these guides. Free, no account needed.