Use Custom Fonts in the Sparkforge Email Builder

By Sparkforge Support Team ·Last reviewed May 3, 2026

Email client support for custom fonts is patchy — Apple Mail, iOS Mail, Samsung Mail, and Outlook.com render them; others fall back. Use @font-face inside an Outlook-safe @media wrapper and define a system-font fallback stack.

Custom fonts in HTML email work in some clients and not others. Building reliably means assuming the font will not load and ensuring the fallback stack still matches your brand voice.

Email Client Support

The following clients render custom fonts:

  • Apple Mail
  • iOS Mail
  • Samsung Mail
  • Outlook.com (web)

Everywhere else — Gmail, the Outlook desktop app, most webmail clients — falls back to system fonts. Plan accordingly.

Define a Font Stack

Always pair the custom font with system-font fallbacks so unsupported clients render cleanly.

font-family: 'OpenSansBold', Helvetica, Arial, sans-serif;

Pick fallbacks that ship on most computers — Helvetica, Arial, Georgia, Times New Roman, Verdana, Tahoma.

Host the Font

Two options:

  • Google Fonts or another hosted provider.
  • Self-host the font files on your own server or CDN.

Sparkforge can host licensed fonts for customers, but only with proof of license.

Use @font-face

The most reliable embed pattern is @font-face inside a <style> block in the email head.

<style>
@font-face {
  font-family: 'Festive';
  src: url('https://fonts.googleapis.com/css2?family=Festive&display=swap');
}

* {
  font-family: 'Festive', cursive;
}
</style>

Outlook 2007, 2010, and 2017 Workaround

These Outlook versions choke on raw @font-face declarations. Wrap the rule in an @media query so Outlook ignores it and falls back to the stack.

<style>
@media screen {
  @font-face {
    font-family: 'Festive';
    src: url('https://fonts.googleapis.com/css2?family=Festive&display=swap');
  }
}
</style>

Test Before You Send

Custom fonts behave differently across clients and devices. Run the email through a preview tool that covers Apple Mail, Gmail, and the Outlook desktop client before you send to the list.

Frequently Asked Questions

Which email clients render custom fonts?
Apple Mail, iOS Mail, Samsung Mail, and Outlook.com on the web. Gmail, the Outlook desktop app, and most webmail fall back to the system stack.
How do I make custom fonts work in Outlook?
Outlook 2007, 2010, and 2017 ignore @font-face. Wrap the declaration in an @media screen query so Outlook falls back to your system-font stack instead of breaking.
Where should I host custom font files?
Google Fonts is the easiest option. Self-host on your own server or CDN if you want full control. Sparkforge can host licensed fonts with proof of license.
What fallback fonts should I pick?
System fonts that ship on most computers — Helvetica, Arial, Georgia, Times New Roman, Verdana, Tahoma. Match the visual weight of your custom font.
Do custom fonts affect email deliverability?
No. Spam filters do not penalize @font-face. Deliverability depends on sender reputation, authentication, and content — not typography.

Was this article helpful?