Using fonts in your emails

Striking a balance between creative brand design and the technical constraints of your customers' email client

Updated over a week ago

Web fonts on websites give designers undeniably better creative options. The use of unique, compelling typography reflects the brand identity of the website. Web fonts add support for fonts that are not installed by default in a browser and are supported by all modern web browsers.

However, when it comes to email, support for web fonts for email is very limited and incorporating them into your designs can present some interesting challenges.

If you’re adventurous or you require that extra brand fidelity for your emails and don’t mind carefully selected fallbacks for clients that don’t support web fonts, then read on!

Which email clients support web fonts?

Generally, the following email clients have good support for web fonts:

  • iOS Mail

  • Apple Mail

  • Android (default mail client, not Gmail app)

  • Outlook 2000

  • Thunderbird

If web fonts are not supported it’s not a total buzz kill as there are fallback fonts that will be seen instead. In most cases, the fallback fonts will be Helvetica, Arial, or a generic sans-serif font, given they are the default fonts of the most popular email clients as we mentioned above.

The key takeaway here is that your email design depends on what email client your customer uses to view your invitations.

*Pro Tip: In April 2018, Gmail released an updated interface for their webmail client. This new interface uses two favorite web fonts: Google Sans and Roboto. What does this mean? Despite Gmail not supporting web fonts, if you use either of these web fonts in your emails, they will render in Gmail.

Example of using custom font

Using a special font like 'Big Noodle' with the fallback font set as Arial the difference can be quite profound.

Examples of how different email clients use fallback fonts

If you'd like to take a closer look at the differences in the fonts check out http://www.identifont.com/differences.html

Next Steps

Talk to our EDM Creative team on how best to reach a balance of design vs execution.

Did this answer your question?