.How to add early-access google font?

Design help Custom code
1

Hi Webflower!

With my current project, I need to use some of the font on google font early access [
Early Access - Google Fonts]
because they have a lot of non-english font. Which is they not available in google font itself.

They give us this code to use it:
image

How to use the font from earlyaccess, without need to download and upload manually. (I’m going to use this chinese font, which is very big to upload to webflow and not really efficient)

Thank you!

2 Likes
2

Well you can declare the font using custom code in the head section, with the @import code.

The you can add CSS code to bind the font to a class. For example:

.notosans{font-family: "Noto Sans SC", sans-serif}

Then in Webflow, add the class .noto to any text element.

2 Likes
3

Thank you for the solution, it works! :star_struck:
I’ve been looking for the solution for several month.

Anyway, Happy Birthday Vincent :tada:

4

Thanks so much :smiley:

Question: does it work inside of the designer (font showing up) if you add the CSS custom code in the page in a custom code box (rather than at page or site level)?

5

You welcome! :yum:

Question: does it work inside of the designer (font showing up) if you add the CSS custom code in the page in a custom code box (rather than at page or site level)?

Sadly, no. It behave as a HTML custom code behavior.
You need to publish it to see those changes.

6

That’s what I expected.