Design Templates
~ 18 min read
16 comments
304156 views
rate it
28 April

Best Fonts for Email: Usage Tips and Tricks

Stripo / Blog / Best Fonts for Email: Usage Tips and Tricks

One of the most striking concerns in the email creation process is choosing the right font. Weight, height, width, color, shape, spacing… Does everything matter? Yes, it does, but the most crucial thing is to choose the font which is legible; all other font parameters are minor.

Watch our short video about the best fonts for emails, their types, web-safe fonts, and ways to apply festive ones with Stripo. And what is most important — we'll show how to choose the right font for your email templates.

Design sophisticated fully responsive emails 

How to choose the right email font?

If you rely only on your personal opinion in this question, there is a chance that your email will look like a message from the past, or will be as user-friendly as people in public transport early mornings.

There are three ground rules to keep in mind when choosing the best font for email:

1. The number of fonts should not exceed 2 and they should complement each other

If you use too many fonts, your email seems very complicated in the best case and annoying in the worst one. Choose only a font or two for one email. In a perfect case, that’s enough to use only one font but different sizes: one to highlight the heading and another one for the rest of your content.

2. Preview your emails across multiple devices when using a custom font

If you choose a web-safe font, you may be sure that it will look the same for all users. But if you add a custom font, you will need to preview your emails across multiple devices to make sure this specific font is supported by all major email clients.

Please be advised that you may run a screenshot testing directly in our editor it will provide you with the screenshots on how your emails and their fonts look across 90 popular environments.

Screeshot Testing

Prior to sending emails out, preview them with the eyes of recipients'

3. Pay close attention to legibility

The main feature of your content’s font is readability. One of the most important features of which is legibility. It’s not quite the same. In one font some characters may be legible and some not.

Legibility is the ability to distinguish one letter from another. Of course, legible text is better and faster to read so check if all characters are visible, clear, and distinctive enough.

The experiment about the font legibility was conducted by Norbert Schwarz and Hyunjin Song in 2010. The results were impressive. You spend almost twice as much time on reading italic and decorative fonts as on default and easy to read ones:

Best Fonts for Emails_Test

Web safe fonts

Here is the list of the top 10 web safe fonts — aka email safe fonts — that you may use with a 100% guarantee that they will render in users’ inboxes just like you planned:

1. Arial

Designed in 1982, is packaged with all versions of Microsoft, starting from the Windows 3, and Apple Mac OS X. Displayed by all email clients. Due to terminal diagonal cuts, it looks less mechanical compared to other fonts of the sans-serif family.

2. Helvetica

A sans-serif typeface, one of the most used fonts of a type, has rounded letters and wide capitals. Designed in 1957

3. Times New Roman

Has tall low-case letters, slightly condensed, short descenders and ascenders. Commissioned by “The Times” in 1931.

4. Verdana

It was designed to be readable on low-resolution screens, its main feature is tall and wide low-case characters.

5. Courier / Courier New

It was designed in 1955, similar to Times New Roman, but adjusted to be a monospaced font. Courier New has heavier dots and commas than the original Courier. Courier is the standard font used for screenwriting in the film industry.

6. Tahoma

It is similar to Verdana yet has narrower letters, small counters, and tight letter spacing. Used as the default screen font for Windows 95, 2000, and XP versions.

7. Georgia

Has tall lower-case, strokers are thicker than average ones, its numerals blend seamlessly with the text due to its similar size.

8. Palatino

It was originally designed for headings, advertisements, and printing. Wider than other old-style serif fonts.

9. Trebuchet MS

Has shortened tails for some letters, in bold its letters are pointy rather than rounded, and rounded dots in lowercase. Released in 1996.

10. Geneva

A redesigned version of Helvetica, its main distinction is that is has a basic set of ligatures.

These fonts are said to be the most readable email fonts. 

Custom fonts 

There are cases when you want or need to use a custom font for your emails, either in order to stay brand consistent or in order to make your emails look more festive for a special occasion.

We want to remind you that you can upload custom fonts to your Stripo account and use them in your email campaigns. 

Use custom fonts in emails to stay fully on-brand

We strongly recommend that you preview these emails across multiple environments. You can do it with our embedded testing tool.

Important to note:

If an email client does not support a certain font, the latter will not be shown properly. It will be replaced with a default font.  

Here is the list of default fonts for the most popular email clients:

  • iCloud Mail uses Helvetica as a default font.

  • Gmail adopts Arial.

  • Microsoft Outlook of the oldest versions often uses Calibri.

  • Outlook 2007/2010/2013 has a Times New Roman as a fallback font.

Which one to choose: a Serif or a Sans Serif font?

One more point is to choose between serif and sans-serif fonts. What’s the difference between them?

Best Font for Emails_Serif VS Sans Serif

Serif fonts could be defined as fonts that have a small line at the end of every character. The most popular serif fonts are Times New Roman and Georgia.

Sans serif fonts are those that don’t have a decorative line at the end of every symbol. The most popular sans-serif safe fonts are Arial, Trebuchet MS, and Helvetica.

During the investigation I have found several sources which claimed that serif fonts are most suitable for emails but I totally disagree. Based on the assumption that emails are being observed only online using the desktop or mobile screens, the best are sans serif fonts. It’s easier to read sans-serif characters on the screen.

Email font size

If you are changing the font, make sure that the one you have picked doesn’t look smaller than the previous one. Often different fonts have different symbol height so the same, say, 15px font will be different due to the chosen font family.

I have made an email template with Stripo which allows comparing different dimensions of the same fonts. Here are the results:

Stripo_Different Font Sizes_Sample

The best email font size is 14px and higher for desktop users and 16px for those who use mobile devices.

We recommend that you set fonts and font sizes when only start designing your email template — the settings will be applied to the entire email. This will save you a large amount of time as it will prevent you from the necessity to set fonts for every part of your emails.

Setting font size for desktops

  • enter the Appearance tab;
  • go to the General Settings section;
  • pick a necessary font from the dropdown menu. The custom fonts, that you have previously added to your Stripo profile, will also appear on this list;
  • set line spacing;

Setting Fonts for Entire Emails

  • in the Stripes section, you set a different font size for every part of your email (excluding banners), and font color;

Stripes_Fonts

  • in the Headings section, you need to pick a font once again — it may be a new one. Here you also set font size for Headings 1, 2, and 3;

Headings Tab_Setting Fonts, Colors and Size

  • in the Button section, please set the button font color and its size.

Working on Buttons_Fonts

Try Stripo Out

Setting font size for mobiles

  • enter the Appearance tab;
  • go to the Mobile View section;
  • set font size for headers, footers, content areas, menu tabs, and buttons.

HTML Email Fonts_Mob View Settings

By working on mobile view of your emails, you make them legible on all devices

Line spacing

Line spacing is the vertical distance between lines. It is measured as the percentage of the font size. 

You can set the desired spacing for your emails just in the tabs and sections where you've just set your font sizes.

Some sources claim that 150% is the best line spacing size. 

But according to Email accessibility guidelines, it varies between 150% and 200%. 1-point Spacing

(email copy with single-line spacing)

1-and-6-Point Interval

(email copy with 1.6-line spacing)

Links in emails

Don’t use a different font to draw readers’ attention to links. Don’t ever put links without anchor text. The text on anchor should explain where this link leads to and be organically a part of the text. Don’t use the words “here” or “link” as an anchor text. They are too short and too general to be interesting.

One of the best practices is to make links of the same color as a logo. It looks great, check it out:

Choosing the Best Font for Emails_Link Color as Logo

You can also underline links for your emails if you find it necessary or if it matches your email design.

Underlining Links

However, we strongly recommend that you never underline links for the sake of email accessibility — it distracts dyslectics.

Buttons in emails

Buttons are the same links but they have a more interactive form for users. It’s better to use both in your email. If you provide a link that will take readers to a blog post, you can make it a text link,  but if you provide a link to try out the product you have, just use buttons.

There is no certain rule about the color for buttons that should be used but it’s better to rely on color psychology and try not to ruin the design concept with too loud color reproduction.

There are two fonts that suit best for buttons: Georgia and Verdana. It’s cool to use Georgia for headings, and subheadings too. It looks great!

Make sure the text’s color matches the button’s color and make sure that it is visible enough for reading. Check also if the text is located properly on the button, it shouldn’t cross the button’s edges. 

Here is an example where the button looks cool:

Choosing the Best Font for Emails_Buttons

Important to note:

You may even add white spacing in buttons with Stripo. It is called “internal paddings. 

Adding WhiteSpace in Buttons

It will add extra space between the button text and the button border. This will make your button copy more legible.

You can also set a different font size for email buttons for the mobile view.

To do so, you need to:

  • go to the Appearance tab;

  • go to the Mobile View section;

  • set button text size — to make your button text legible on mobile devices. 16px or higher is the best size here;

  • toggle the “Full-width buttons” button to make your buttons wider on mobile devices. The chances customers will notice full-width buttons are too high.

Full-Width Buttons for Mobiles

Make your CTA buttons noticeable and clickable everywhere

Text over banners

Here is the chance to use a festive, or decorative fonts that you shouldn’t actually use as the main text font. Since the text over a banner is a part of an image, it will remain the same across all email clients, so you may choose any.  

The main thing you should care about while creating an email banner is keeping your brand identity. You may use any font but it’s better to choose a legible one. Don’t write too much text on a banner.

Best Email Font for Banners

(Email example with an easy to read font) 

Banners with Decorative Fonts

(Email example with a decorative font).

Which one to use depends on your inspiration and email design.

Using decorative fonts with Stripo

  • when your banner image is uploaded and edited, you click the "Text" icon above the template to start working on button copy;

Stripo-Adding-Text-to-the-Banner

  • enter your copy in the "Caption" section on your banners;
  • then highlight your banner text and pick a desired banner font from the dropdown list.

Setting Banner Fonts

Join Stripo

Email font color

There are only 2 rules you should follow here:

1. Keep the number of colors to a minimum

You should only use the colors that are present in your brand identity. If you have an idea to use more than 3 colors in your email, just leave this idea aside because it will make text unreadable. 

You may even reduce this amount to two colors while making the header the same color but emphasizing it with a different size or font.

If you want to highlight one sentence or a phrase just use a bold font, using the different color is ambiguous.

2. Use contrast colors

If you intend to use bright colors — many of us do when it comes to holidays — be sure to use contrast colors. Don’t place red text over green buttons, don’t use white over grey. It may seem festive enough for people who have good eyesight. However, color blind people may not find our text legible.

Commonly for email content, designers use black or dark grey colors. It’s better for readability. The only exception is when you have a black background. In this case, use a white font. Don’t use a light grey font because it’s hard to read through the different contrast range settings.

HTML tags for text formatting

Usually, web-safe fonts are declared in a CSS layout, so it will be not just simple HTML already but there are several HTML tags for text formatting, I hope that everyone had known it before but, nevertheless, here they are:

  • For using a bold font:

<strong> </strong> or <b> </b>
  • For making the dotted list in email use this structure:

<ul>

    <li>first statement</li>

    <li>second statement</li>

    <li>third statement</li>

</ul>
  • For using cursive to emphasize the text:

<i> </i> or <em> <em>
  • For adding a small text of the same font as you use:

<small> </small>
  • To highlight the text with yellow (by default) filling:

<mark> </mark>
  • To mark that some text that was deleted but not replaced:

<del> </del>
  • And this one allows you to define a paragraph:

<p> </p>

Email accessibility guidelines

In a nutshell, we should consider these guidelines for several reasons:

  • to enable color blind people to read our emails;

  • to enable people with visual impairments to listen to our emails with screen readers;

  • to enable our users who are extremely busy and check their emails while driving or cooking and ask Siri to “read” their incoming messages, to listen to our emails;

  • to enable dyslectics to read our emails — as many of the people who suffer for dyslexia are not aware of it, but reading unadapted texts is quite unbearable to them. 

So, the guidelines to make your email text accessible:

  1. Consider color contrast.

  2. Make your texts left-aligned for easier perception of email copy by dyslectics — avoid center-aligned texts.

  3. Always add punctuation marks at the end of every bullet point. Yes, it may be against grammar rules, but by doing this we make our emails more legible and make at least one recipient happier.

  4. Keep font size 14 pixels or more.

  5. Do not underline texts.

  6. Avoid Italic type. If you need to highlight any part of your text, use only bold type!

  7. Do not use all caps!

For more information, please refer to our "Email accessibility" blog post.

Best practices for email safe fonts implementation 

Due to many experiments made by the eSputnik marketing team, the best fonts for emails for Russian-speaking countries are Arial and Tahoma. Arial is the most compelling font among those who set up email marketing campaigns in Russian. Tahoma looks great in both content-heavy emails and small texts. 

Helvetica is the most popular font among English-speaking countries. Arial takes the 2nd place. 

Preferences may vary from country to country due to language features.

To choose the most legible one in your opinion, according to your alphabet features, you may test all the email-safe fonts as we did. You can also ask your friends and colleagues to help you with this test.

I have created an email template with Stripo editor with the same text and the same size 18px for each font. There are no Palatino and Geneva at Stripo email editor but there are custom fonts like Roboto and Open Sans which are used as the default fonts by some email clients.

So, here are the results, just compare these fonts and choose the one that fits your needs the most:

Choosing Email Fonts

Don’t waste your time looking for the best font for Gmail, the best font for Outlook, and any other email client. Because email clients replace the unknown fonts with the fallback ones. And like we said above, Gmail uses Arial, Outlook replaces unknown fonts with Time New Roman, and Mac OS X uses typeface Helvetica.

Final thoughts

Considering all the above, we can say there are no professional-looking email fonts that are legible and look nice across all kinds of devices. You always have to choose:

  • Georgia and Times New Roman are too narrow;

  • Courier New is wide but maybe even too wide for email;

  • Arial is lighter than Helvetica;

  • it’s impossible to tell apart Verdana and Tahoma fonts.

Apart from choosing the right email font, we need to make our emails accessible by sticking to the guidelines mentioned above.

Stripo offers a number of email-safe and decorative fonts. You can also upload custom ones.

Paulo Marreiros 3 months ago

Excelente o artigo dessa página. De muito gosto! Todos as minhas dúvidas e ac e acredito que também de outras pessoas, foram esclarecidas. PauloMar/São Paulo, Brazil.

Hanna Kuznietsova commented to Paulo Marreiros 3 months ago

Paulo, Obrigado por uma revisão tão agradável. Estamos muito felizes que o artigo tenha sido útil. Desejamos sinceramente o melhor em suas campanhas

pirates 4 months ago

nice blog theme you use in your blog can you share which theme you are using

Hanna Kuznietsova commented to pirates 4 months ago

Hello, Pirates. Thank you for your question. If you are talking about the font we are using, it is Montserrat, 16px. If it's not what you asked us about, then could you clarify please what theme exactly you mean? Thank you

Igor Greshner 6 months ago

Parabéns pela excelente pesquisa! Esclareceu bastante minhas dúvidas, sou a favor da Verdana e Tahoma a anos, por ser um formato mais agradável para ler.

Hanna Kuznietsova commented to Igor Greshner 6 months ago

Igor, Muito obrigado )) Estamos muito satisfeitos que nosso artigo seja útil. Desejo-lhe sucesso em email marketing

Khairom Munawwar Baharom 1 year ago

Hi Hannah. Do Montserrat font can go multi-platform on email? (Gmail, Outlook, etc..)

Hanna Kuznietsova commented to Khairom Munawwar Baharom 1 year ago

Khairom, Thank you for your question. Unfortunately, it is not a websafe font. I just uploaded Montserrat to my account, sent an email to some email addresses. Only Apple Mail and Apple iPhone Mail (Native Mail on iOS) did not replace Montserrat with a default font. Others did replace it with the default fonts. Tests with Email on Acid just confirmed that Montserrat gets to be replaced by Gmail and Outlook.

Martin Schenk 1 year ago

Für deutsche Texte ist Verdana und Tahoma nicht empfehlenswert, da die abschließenden Anführungszeichen "verkehrt" dargestellt werden.

Hanna Kuznietsova commented to Martin Schenk 1 year ago

Vielen Dank für Ihren wertvollen Kommentar. Wir haben die notwendigen Änderungen an unserem Artikel vorgenommen. Viel glück

rohit dubey 1 year ago

Thanks for sharing this amazing content. This is really helpful for us.

Hanna Kuznietsova commented to rohit dubey 1 year ago

Rohit Dubey, We're glad to hear you find this helpful. You might be interested to know that you can upload custom fonts to your projects with Stripo. https://stripo.email/blog/add-use-custom-fonts-stripo/ Have a great day!

Marcia Bosscher 1 year ago

What font are you using for this post? I like it!

Hanna Kuznietsova commented to Marcia Bosscher 1 year ago

Marcia, Thank you. We are flattered to know. It's Montserrat, 16px. For your convenience, to detect fonts on other websites, you can use this tool http://whatfontapp.com/ Have a good day

Myron Gould 1 year ago

I found this article to be a very helpful refresher. Thank you!

Hanna Kuznietsova commented to Myron Gould 1 year ago

Myron, We're glad you liked it. You may be also interested in reading Paul Airy's post to find out which of the web-safe fonts is best for email accessibility. http://createsend.com/t/d-ABFFF5F25EC93A19 Also, we're glad to say that you can upload custom fonts with Stripo. If you have any questions about custom, web-safe and accessible fonts, or if you have any questions regarding our tool, please feel free to contact us at any time. Thank you for your interest in our blog!

You might be interested in

← previous next →
Survey Invitation Email_Featured Image_Stripo
today · 14 min read
10 Best Practices to Create Survey Invitation Emails

You want to improve your business strategy and you are full of energy to make it better. To know which way to go you start sending out survey emails to your clients, but hardly ever receive any response? No wonder because the average customer survey response rate is about 14%, and only big world-famous companies may reach the 25% point. In this post, we’ll show proven ways to increase the conversion rate of online survey email invitations and share the...

Design Marketing Templates
04 November · 17 min read
Christmas Email Marketing 2020-2021: Guide with Ideas and Examples

Christmas is the best time of the year. People are full of expectations and hopes for miracles and happiness to come or stay. And marketers are full of hopes to break their selling record ;)  (Source: Email template by Stripo) How can you make your Christmas marketing emails stand out among thousands of offers provided by other brands? It’s not that difficult. The key to success in Christmas email marketing is simple — do not sell your products, put a...

Design Marketing Templates How-to
Be always wide awake in recent email marketing news, guides, articles and how-to’s