Email Safe Fonts & Web Safe Fonts for Email Explained

Font choice can either be easy or very difficult when it comes to email marketing. 

Email apps generally give you a list of basic fonts to choose from, such as Times New Roman, Century Gothic, Arial, ect. If you want to use one of these basic fonts in your email design, then your choice is pretty straightforward. 

For those looking for more design flexibility, finding a suitable font can be significantly more challenging. 

Very quickly you start encountering terms like email safe font, web fonts, fallback fonts and web safe fonts. All these different types of fonts and their varying degrees of support among email clients can quickly cause a headache.

So in this post, we aim to explain all these terms and all the major considerations you should be aware of as simply as possible. 

What is an email safe font?

Let’s start with the basics: what exactly is an email safe font?

In the most basic terms, an email safe font is simply a font that’s supported (i.e., can be displayed) across all modern email inboxes. 

By using these fonts, you can be sure that your email’s font will be displayed consistently for all your subscribers. These fonts are also very legible, so unless your font size is too small, your subscribers shouldn’t have difficulty reading your emails.

List of email safe fonts

Email safe fonts include:

• Arial
• Century Gothic
• Courier New
• Garamond
• Georgia
• Helvetica
• Impact
• Lucida
• Times New Roman
• Tahoma
• Trebuchet
• Verdana

What is the difference between email safe fonts and web safe fonts?

The list of web safe fonts overlaps significantly with the list of email safe fonts. Web safe fonts are simply those that are also supported across virtually all modern devices and operating systems. 

While there are some technical differences between web and email safe fonts, for all intents and purposes when choosing a font for your email marketing, you can think of them as being the same. 

This list here is a great resource as in addition to listing web safe fonts, it also shows the percentage of users on PCs and Macs that have the fonts installed. That is, the percentage of people using these devices where the font will display correctly. 

What are web fonts?

To complicate things further, there’s another term you should be aware of: web fonts. 

Web fonts are not the same as web safe fonts or email safe fonts. Instead these are fonts that have generally been specially designed for use on the web only. 

This means they don’t generally come included in operating systems or devices. When someone comes across a website utilizing a web font, that font will be loaded directly into the browser from a server so it can be displayed. 

Having hundreds and hundreds of different web fonts available to use has been a godsend to graphic designers. If it wasn’t for web fonts, the internet would look a lot less well designed than it does now. 

Can I use web fonts in my email marketing?

Even though web fonts have opened up a variety of different design opportunities for web designers, email marketers need to proceed with caution. 

Web font support in email clients

Unfortunately not all email clients support web fonts. According to Litmus, the following email clients currently support web fonts: 

• Apple Mail
• iOS Mail (default mail app on iPhones and iPads)
• Android Mail (default mail app; not Gmail)
• Samsung Mail
• Outlook for Mac
• Outlook App (not the web version)

There are also smaller email clients out there that support web fonts (like Thunderbird) but the list above covers the major players.

The good news is that together these clients represent around 50% of the total market for email opens. The bad news is that the world’s most popular email inbox provider, Gmail, isn’t on the list. 

Gmail officially only supports two web fonts: Open Sans and Roboto. Don’t expect any other web font to render correctly in Gmail. 

Gmail web font support

Does Gmail support web fonts? No.

As Gmail doesn’t support web fonts, you might be wondering whether it’s they’re still worth using. Afterall, it’s likely a decent percentage of your email opens are occurring in Gmail. 

Fortunately, just because Gmail doesn’t like you using custom fonts, it doesn’t mean you can’t use web fonts altogether. This is thanks to fallback fonts. 

Fallback fonts

Fallback fonts are fonts that have been nominated to replace a preferred font if it is not able to be rendered on a particular device. 

For example, let’s say you wanted to use Montserrat (a web font and not an email safe font) in your email campaigns. When someone opens your email in a client that doesn’t support web fonts, a different font will be used instead of Montserrat, such as Arial. 

If you’re coding your own emails you can select your own fallback fonts to best maintain the aesthetic you want. Otherwise if no fallback font is available, then the email client will render the email in its default font. 

Every email client has its own default font. For the most popular clients, these are:

• Gmail: Arial
• Apple (default Mac and iOS apps): Helvetica
• Outlook: Calibri

Going back to the Montserrat example, if you want to set it up to have Verdana as the fallback, you can use the following code in your CSS:

<style type="text/css" >
#email-body {
 .email-titles {
font-family: "Montserrat", Verdana, Arial, sans-serif;
}
}
</style>

Don’t be put off by the code though. Many email marketing apps like SmartrMail will give you more fonts to choose from than just the small list of email safe fonts. 

If you choose one of the custom web fonts, you don’t need to worry about setting up fallbacks. These have already been set up for you for each of the fonts available to choose from. 

So with SmartrMail you can rest assured that if your first choice isn’t available, we’ll use the next most suitable font that resembles the original as closely as possible.

How to use web fonts in email marketing

If you want to send your own HTML emails and use web fonts, there are a few things you should keep in mind. 

Firstly you will need to find a font to use. 

A great place to get started is Google Fonts. Google Fonts has over 900 custom fonts for you to choose from and makes it relatively easy to use in your email campaigns. You can then use the Google Fonts API to have the custom served to your subscriber from the server. 

You can do this with the following snippet: 

<style type="text/css" >
@import url(https://fonts.googleapis.com/css?family=Montserrat);
</style>

Again, that example is for if you want to use Montserrat in your email. You can find a more detailed guide to doing this along with setting up fallback fonts from Litmus here.

Additionally you should also be conscious of licensing agreements when using web fonts. Because web fonts are generally designed for use on web pages, you might find some restrictions on using them in your email marketing. 

Next steps

So far we’ve only talked about the technical aspects of choosing a font for email marketing. We haven’t even begun to touch on all the design considerations to take into account. 

Not only should your fonts render properly, but they should also reflect your branding and message you want to communicate to customers. 

Thankfully we also have a guide on picking the best font for email marketing. The detailed guide covers everything from the difference between serif and sans serif fonts, font size, font weight, and style font families. 

If after choosing a font, you’re still worried about how it will appear in subscribers’ inboxes, there are ways to check. Tools like Email on Acid and Litmus make it easy to get a preview of exactly how your email will appear across as a variety of email clients and devices. 

FAQs