How do I set fallback fonts for Adobe Typekit fonts?

Design help General
1

Hey Webflow community,

I am in progress of building a site for a client and have linked up Adobe Typekit / Adobe Fonts for Halyard and Bressay Display. I wish to set fallback fonts – Roboto and Domine from Google Fonts however am unsure how to do this within Webflow.

Any help would be much appreciated.

Thanks!

2 Likes
2

I would like to know as well, this will be handy. Better yet, Webflow should expand its fonts features on settings panel to include Fallback fonts for instances like this.

3

Go to a published project and inspect the code. Easy. You’ll notice that they provide a fallback list already.

font-family: Arial,‘Helvetica Neue’,Helvetica,sans-serif;

4

Thanks Jeff, I think what Miek and I were after is the ability to define these fallback fonts – either within the existing Webflow selection or additional fonts from Google Fonts – e.g. Roboto for body text and Playfair Display for Headings

1 Like
5

Got your point. The browser default font selection is the fallback. That being said you, you can set your desired base font by styling the body in the designer, not a new class on the body element. I normally set my body font, then headings. Then I tune for different classes or elements. Want more that one font on the body? You could do this as custom code using a new CSS rule for body in the for example.

I think there are a lot of small things webflow does not expose, to protect users, I mean designers, from doing things that hurt the user experience. I would imagine that people would load up ten fonts and then complain about performance for example. I have no idea but after reading lots of forum posts I could see the point of restrictions.

Hey man, I just want external images without custom code!

6

Setting BODY font does not work on rollback fonts unfortunately after Jan 18. All my projects went from Sans / Sans-Serif rollback to Serif Times new roman after saving projects after January 18 as rollback even though my global body tag is defined as a sans or sans-serif font.

1 Like
7

@miekwave - can you pm me an example published site?

8

Hi @webdev

This issue has been escalated in this thread: Fallback font only showing Times - #5 by miekwave