MailViewr - Free HTML Email Preview Tool
← CSS Support Index

Does CSS @font-face Work in HTML Email?

`@font-face` in CSS allows to include your own fonts inside an email.

Quick Answer

Does @font-face work in HTML email?

The CSS @font-face property is supported in Outlook (Mac / Web), Apple Mail, Samsung Email, Thunderbird, and others. It is NOT supported in Gmail, Yahoo! Mail, Fastmail. Always include a safe fallback for unsupported clients.

Which Email Clients Support CSS @font-face?

CSS support for @font-face across email clients

Email ClientDesktopMobile / WebNotes
Gmail✗ No✗ No
Outlook (Windows)~ Partial?
Outlook (Mac / Web)✓ Yes✗ No
Apple Mail✓ Yes✓ Yes
Yahoo! Mail✗ No✗ No
Samsung Email?✓ Yes
Thunderbird✓ Yes?
ProtonMail✗ No✓ Yes
Fastmail✗ No?

Notes

  • #1 Partial. Only supported through a `<link>` tag.
  • #2 Partial. Only supported directly through a `<style>` tag.
  • #3 Buggy. Support depends on the version of IE installed.
  • #4 Partial. The declaration is supported but distant fonts are ignored.
  • #5 Buggy. Elements using a font declared with `@font-face` ignore the font stack and fall back to Times New Roman. Use `mso-generic-font-family` and `mso-font-alt` to control the fallback.
  • #6 Not supported. Roboto and Google Sans can be used, but only because they're embedded with the webmail's own styles.
  • #7 Not supported. The `@font-face` declaration is kept but the `src` property is removed.
  • #8 Not supported when using a Microsoft email address; outlook, live, hotmail, etc.

Frequently Asked Questions

Related CSS Properties

Test Your Email Now

Paste your HTML and see how it renders in clients that don't support
@font-face.

Open Email Previewer