Web fonts in email work in roughly half the clients your list uses. Apple Mail supports them, most Gmail contexts do not, and Outlook on Windows definitely does not. So every email is really designed twice: once with your font, and once with whatever the client substitutes.
The goal is not to force your font everywhere. It is to make both versions look intentional.
Support, roughly
Supports web fonts: Apple Mail on macOS and iOS, Outlook for Mac, Samsung Mail, and a few others.
Does not: Gmail in most contexts, Outlook on Windows, Outlook.com, Yahoo Mail, and most webmail.
The practical split is that Apple's clients render your typography and almost nothing else does. If your audience is consumer and iPhone-heavy, a web font reaches a meaningful share; if it is B2B on Outlook, it reaches almost nobody.
The fallback stack is the real design decision
Since the fallback is what most people see, choosing it deliberately matters more than choosing the web font.
font-family: 'Your Font', -apple-system, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
The important property is that the fallbacks have similar metrics to your web font — comparable x-height and character width. A narrow web font falling back to a wide system font reflows your layout, breaks your line lengths and can push a button onto two lines.
Test the fallback deliberately: preview with the web font disabled and look at the layout rather than the letterforms. That is what most of your list sees.
The fonts that always work
- Arial and Helvetica — universal, unremarkable, safe.
- Georgia — the most reliable serif, and genuinely pleasant at body sizes.
- Verdana — wide, very legible at small sizes, dated.
- Tahoma, Trebuchet MS, Times New Roman, Courier New — available essentially everywhere.
System font stacks are also worth considering: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif renders in whatever the recipient's operating system uses for its own interface, which looks native and modern everywhere without loading anything. For a lot of email this is a better answer than a web font.
Loading a web font, if you do
Use @import or a <link> in the head, and expect it to be stripped in some clients. Wrap it in a media query so Outlook's engine ignores it entirely rather than misinterpreting it:
<style>
@media screen {
@import url('https://fonts.googleapis.com/css2?family=YourFont');
}
</style>
Keep it to one or two weights. Each additional weight is another request, and email clients are unforgiving about slow loads.
A separate consideration: an external font request tells the font host when and where your email was opened. If you have privacy commitments in your footer, it is worth knowing that this is a tracking vector you may not have counted.
Sizes that work
- Body text at 16px minimum. Below that iOS may zoom the whole message, which breaks your layout in ways a desktop preview never reveals. This is the single most consequential typography rule in email.
- Headlines at 22–28px. Desktop-sized headlines dominate a phone screen.
- Line height around 1.5, set in points with
mso-line-height-rule: exactlybefore it, or Outlook applies its own leading. See why your email looks broken in Outlook. - Line length around 50–75 characters. Longer is hard to track back to; shorter feels choppy.
Contrast and legibility
Grey body text on white is the most common legibility failure in marketing email. WCAG AA wants 4.5:1 for body text, and light grey on white is usually well under.
Build with headroom, because dark mode inversion can shift your effective contrast in ways you did not choose. More on this in email accessibility.
Also avoid text inside images. It cannot reflow, it disappears when images are blocked, and it is invisible to screen readers and to spam filters — which is one of the reasons image-only emails score badly.
Frequently asked questions
Do web fonts work in email?
In about half of clients. Apple Mail and Outlook for Mac render them; Gmail in most contexts and Outlook on Windows do not. Design so the fallback looks deliberate, since it is what most recipients see.
What is the best font for email?
Something universally available — Arial, Helvetica or Georgia — or a system font stack that uses whatever the recipient's operating system provides. Both look intentional everywhere without depending on a font that may not load.
What font size should email body text be?
16px minimum. Smaller text can trigger automatic zoom on iOS, which rescales the entire message and breaks the layout in a way that never appears in a desktop preview.
Why does my font look different in Outlook?
Outlook on Windows uses Microsoft Word's rendering engine, which does not load web fonts. It falls back to the next available font in your stack, so the stack — not the web font — determines what Outlook users see.
