A

Anonymous

Solved

Why are my fonts changing once it's been delivered?

Forum|Forum|5 years ago
February 24, 2021
18 replies
2967 views

Hi there,

What's the best way to set a font that shows up in all email providers? I’ve been using Century Gothic within my templates as it fits in well with my branding style, but it always reverts back to Arial when delivered to my subscribers. Is there another font I could use that’s still modern and in keeping with my brand, and still shows up the same upon delivery in most email clients?

Here’s a screenshot of the current font I use and how it shows up in the Klaviyo preview.

Thanks,

Meeta

This topic has been closed for replies.

Best answer by elisegaines

Hi @meets ! Apple devices have their own version of Century Gothic, called Apple Gothic; you can get that font to appear instead of Arial by adding this code into your template:

<style> h1, h2, h3, h4, p, ol, li, ul {font-family: Century Gothic,CenturyGothic,AppleGothic,sans-serif; }</style>

To add this code to a template:
1. Click into the first text block in your template, and then click the “Source” button to open up the source code

2. Paste the code above into the very top of the text block’s source code

You’ll only need to do this one time per email template.

Best,

Elise

caroline

Klaviyo Alum

Hi there,

Century Gothic is generally considered a web-safe font. Could you provide some additional information, specifically regarding what inbox providers the subscribers who are seeing Arial are using? Do you have any screenshots you can share? (Please be careful not to include any of your API keys or customer data.)

If you’re looking for similar fonts, Futura is pretty close to Century Gothic.

Best,

Caroline

Caroline Lu

A

Anonymous

Hi Caroline,

Yes I thought so too! So here’s an example of how that same text appears in Gmail (mobile)…

caroline

Klaviyo Alum

Hi there,

This is likely a result of the fact that Gmail does not support web fonts.

This Stack Overflow post does provide a list of fonts supported by Gmail; Century Gothic is unfortunately not included in that list.

Are you encountering the same issue with any other inbox providers, or is just Gmail?

Best,

Caroline

Caroline Lu

A

Anonymous

Hi Caroline, thanks, will ate a look at that article.

This is also happening on a few others too (e.g. Samsung’s own email app, Outlook etc),

Thanks,

Meeta

A

Anonymous

I’ve also just tried Verdana (it’s in the list you sent over) and still having the same issue.

caroline

Klaviyo Alum

Hi there,

That’s good to know. Can you specify how you’re using these fonts? Are you using the built-in Klaviyo fonts, or are you using one of the methods described in this Help Center article?

Best,

Caroline

Caroline Lu

A

Anonymous

Hi Caroline, I’m just using them within the Klaviyo email builder.

E

elisegainesAnswer

Customer Ed.

Hi @meets ! Apple devices have their own version of Century Gothic, called Apple Gothic; you can get that font to appear instead of Arial by adding this code into your template:

<style> h1, h2, h3, h4, p, ol, li, ul {font-family: Century Gothic,CenturyGothic,AppleGothic,sans-serif; }</style>

To add this code to a template:
1. Click into the first text block in your template, and then click the “Source” button to open up the source code

2. Paste the code above into the very top of the text block’s source code

You’ll only need to do this one time per email template.

Best,

Elise

A

Anonymous

Hi @elisegaines Thanks for this! I will test this out!

(Sorry I only saw you had replied when I logged in just now)

A

Angel from eCohete

Contributor III

Hello, everyone.

I’m having a similar problem where, in the mail editor, fonts styles are applied but at inbox they look as the fallback fonts, I’m using this snippet:

----

p, ol, li, ul { font-family: Pathway Gothic One

, Trebuchet_MS, sans-serif; font-weight: 400

}

h1, h2, h3, h4 { font-family: Carrois Gothic, Tahoma, sans-serif;

}

</style>

----

I’ve used this snippet before with Poppins, and Quicksand fonts and worked very well, so I don’t know if it’s a matter of font or if I’m missing something. Any help is welcome!

Thanks!!

Show more replies

Sign up

Use your Klaviyo credentials

Log in to the Community

Use your Klaviyo credentials