A four-email onboarding series built in MJML: welcome, activation, trial ending, day-14 check-in. Built for Outlook, Gmail and Apple Mail, and it holds up in dark mode. The first email is free.
What actually happens in each client, and why the markup is built the way it is.
Outlook renders mail through the Word engine. The layout is nested tables with conditional comments, so the structure holds and nothing collapses — but the dark theme is ignored and it stays light, which is intentional.
Gmail strips part of the media queries and clips messages over 102 KB. Each email here is well under that, and the mobile layout works even where the media queries are dropped.
Full support, including the dark theme. Backgrounds and text stay contrasty rather than being auto-inverted into mush.
Dark mode is handled with prefers-color-scheme plus
[data-ogsc] fallbacks for Outlook.com, which rewrites
colours instead of reading media queries.
| Client | Light | Dark |
|---|---|---|
| Outlook 2016 / 2019 / 365 (Windows) | ✓ | — |
| Outlook.com | ✓ | ✓ |
| Gmail web | ✓ | ✓ |
| Gmail iOS and Android | ✓ | partial |
| Apple Mail | ✓ | ✓ |
| Yahoo Mail | ✓ | ✓ |
| Thunderbird | ✓ | ✓ |
“partial” means the client applies its own colour inversion rather than reading the palette in the source. Nothing breaks — it simply is not identical to the design.
The home page and its CSS — enough to publish a one-pager. A credit link stays in the footer.
Every page, the Pro-only pages, the source files, no attribution, and 12 months of updates and email support.
Use it in unlimited personal and commercial projects, including client work.
Do not resell the template itself, alone or in a bundle.
Outlook renders email with the Word engine. Anything that behaves in a browser falls apart there: flexbox does nothing, margins collapse unpredictably, and background images are ignored outright.
These emails are built on tables with conditional comments for Outlook — the constructions that are known to survive the Word engine — rather than on anything a browser preview would happily render and Outlook would not.
Gmail on iOS and Android honours the dark theme by inverting colours itself rather than
reading prefers-color-scheme. The result is readable and contrasty, but it is Gmail’s
inversion, not the palette in the source. Nothing breaks; it simply is not identical.
The free archive is email 1 as compiled HTML. Pro is all four, plus the MJML source and the shared theme file so you can change the palette once.
Merge tags use the common {{variable}} syntax — {{first_name}}, {{cta_url}},
{{unsubscribe_url}}. Most providers accept it directly. The sender name, address block
and unsubscribe link are placeholders and must be replaced: an unsubscribe link is a legal
requirement in most markets.
Fourth email (day-14 check-in) added to Pro; free archive is now email 1
First release
Four emails a shop actually sends, built in MJML in a 1970s ledger style: the parcel went out, here is your receipt, your seat is held, the thing you asked about is back. Warm paper, oxblood, squared corners. Built for Outlook, Gmail and Apple Mail, dark mode wired up. The dispatch email is free.
Three newsletter emails built in MJML: a one-column digest, a magazine issue with a lead story and two-up grid, and a single-message announcement. Sample copy written in full. Built for Outlook, Gmail and Apple Mail, dark mode handled. The digest is free.
The four service emails every shop or app sends, built in MJML: order receipt with line items, shipped with tracking, password reset, email confirmation with a code. Built for Outlook, Gmail and Apple Mail, dark mode handled. The receipt is free.