Dark Mode Email Preview
See your email in dark mode before you send it.
Gmail and Outlook don't just flip a background colour — they run your HTML through a real colour-transformation algorithm. Toggle dark mode on a live preview and see it per client — 5 free previews, no signup.
👋 5 free previews, no signup · verified against real device recordings, not emulators
Why this is hard
It's not a CSS trick.
Even a perfect prefers-color-scheme: dark media query won't help — Gmail ignores it. It rewrites every background, text, and border colour in your HTML using its own algorithm, based on each colour's luminance and role, not your CSS.
The transform is client-specific and non-uniform: a dark navy background on Gmail iOS shifts toward light blue/lavender; the same background on Gmail Android behaves differently again. Desktop Gmail and Outlook don't apply any dark mode transform at all — they render exactly as coded.
The practical damage: brand colours washed out, text that becomes unreadable against a shifted background, panels that merge together once both are inverted. All of it is invisible until you're actually looking at dark mode — which is the point of this page. Read the full engineering writeup.
The alternatives
Three ways preview tools usually get this wrong.
Applies filter: invert(1) to the whole email — flips images and logos along with everything else. Looks nothing like real Gmail dark mode.
Triggers prefers-color-scheme: dark and renders whatever alternate styles you wrote. Works for Apple Mail — Gmail ignores it completely.
Sends a real email and captures a device screenshot. Accurate, but minutes per preview — impossible to iterate on while you're still editing.
MailViewr models Gmail and Outlook's actual per-colour transform instead — see how in the engineering writeup.
Accuracy at a glance
Verified against real devices.
FAQ
Questions, answered.
No. Gmail on iOS, Android, Chrome, Safari, and Firefox ignores prefers-color-scheme media queries entirely and instead rewrites your email's colors with its own proprietary algorithm — analyzing each background, text, and border color and transforming it based on luminance and role. Outlook mobile applies its own partial color overrides, while Apple Mail supports prefers-color-scheme natively and renders the alternate styles you wrote.
Most either apply a blanket CSS invert filter (which flips images and logos along with everything else), simulate prefers-color-scheme (which Gmail ignores), or rely on a real device screenshot (accurate but slow to iterate on). None of these model what Gmail actually does to your specific colors.
Gmail Android dark mode is ~90% accurate; Gmail iOS dark mode is 75–80% accurate (its hardest client to model). Outlook Android/iOS dark mode is 70–75% accurate and still in beta. Desktop Gmail and Outlook don't apply dark mode transformation at all — they render exactly as coded. Apple Mail supports dark mode natively via prefers-color-scheme, so it renders the alternate styles you wrote. Every figure is verified against real device recordings, not emulators.
The first 5 previews, including the dark mode toggle, are free with no signup — after that we ask you to sign in.
Stop guessing what dark mode does to your email.
Paste your HTML and toggle dark mode instantly — 5 free previews, no signup, no test send.
Free HTML Email Preview