New message · free feature
Design an email signature that survives dark mode. See how Gmail and Outlook shift colors, and keep your logo and text readable either way. Free tool.
Create your signatureRe: What it is
Email clients apply one of three treatments. Some leave your colors untouched. Some partially invert, darkening light backgrounds while keeping already-dark text dark, which can produce dark-on-dark text. Some fully invert everything, turning your navy text pale and your white background near-black. Which treatment you get varies by client, platform, and even account type, and the prefers-color-scheme media query that fixes this on the web is stripped by Gmail and others. Since you cannot target dark mode reliably, the winning strategy is defensive design: choose colors and image treatments that remain legible under every one of those three outcomes.
Re: How it works
Step 1
Find any transparent PNG with dark text or a dark logo mark. These disappear on dark backgrounds. Re-export them with a solid background, a padded white rounded rectangle, or a light outline around dark shapes.
Step 2
Pick a template in BrandFooter's free generator and use mid-tone colors for accents and links. Avoid pure black text and pure white backgrounds, which are exactly what inversion algorithms rewrite most aggressively.
Step 3
Click Copy HTML and paste the signature into Gmail, Outlook, or Apple Mail settings as usual. The HTML itself needs nothing special; the resilience lives in your color and image choices.
Step 4
Send yourself the signature and view it with dark mode on in the Gmail app, Outlook desktop, and Apple Mail. If every element stays legible in all three, you are covered for the vast majority of recipients.
Re: Why it works
Key benefits of adding a dark-mode-safe design to your email signature.
Re: Doing it well
Best practices to get the most out of this feature.
Re: Common questions
Common questions about a dark-mode-safe design in email signatures.
It is almost certainly a transparent PNG with dark artwork. In dark mode the email background behind the transparency turns near-black, and dark-on-dark reads as nothing. Re-export the logo with a solid light background or add a light outline around the dark shapes and it will survive both themes.
Not dependably. Tricks exist, such as certain color formats and meta tags that some clients respect, but Gmail and Outlook each ignore different ones and update their behavior without notice. Designing the signature to be legible under inversion is the only approach that keeps working.
Frequently, yes. The Gmail apps apply automatic color transformation to messages when the device theme is dark, lightening dark text and darkening light backgrounds. The exact result varies between Android and iOS versions, which is why testing on a real device beats reasoning about the algorithm.
Only in a minority of clients, notably Apple Mail. Gmail strips style blocks where media queries live, and Outlook's Word engine never supported them. Any dark mode strategy built on that query fails for most recipients, so treat it as a progressive enhancement at best, never the plan.
Mid-tone accents, very dark gray instead of pure black for text, and images with baked-in solid backgrounds. Medium-saturation blues, teals, and greens hold their character under partial inversion, while extremes of brightness get rewritten hardest. Check contrast against both white and near-black to confirm a color earns its spot.
Fwd: Worth a look
dark mode email signature
Dark mode inverts email backgrounds and can make logos and text in signatures unreadable. Learn what changes and how to design around it.
email signature colors
Email signature colors are the text, accent, and link hues in your sign-off, set as inline hex values and chosen to survive dark mode inversion.
email signature design guide
A complete guide to designing email signatures that look great and render correctly in every email client.
email signature generator
An email signature generator is a tool that turns your details into ready-to-paste, email-safe HTML, sparing you from hand-coding tables.
email signature image formats
PNG, JPG, and GIF are the image formats that work in email signatures. Learn which to use for logos, photos, and banners, and why SVG fails.
email signature photo
An email signature photo is a small headshot beside your contact details that puts a face to your name. See sizing, format, and when to use one.
Build a signature with colors and images that stay legible in any theme. Free generator, clean table-based HTML, tested across Gmail, Outlook, and Apple Mail.
Create your signature