On this Webflow lesson we take a look at importing Google fonts. How to install custom fonts in Webflow and how to configure Adobe API using Webflow.
All our project files for you to practice and play with along with some bonus materials.
Take a moment to download this Webflow Template so you can practice, experiment and use however you want!
Let's take a look at importing fonts
directly into our project.
Now, if we open up our Milanote,
remember that on the client assets
we have already the Sovereign font, we
can download that on our local computer
but notice that one of the fonts from
the branding is actually Google Fonts,
its available on Google fonts, it's called
Archivo Narrow, so what I wanna do
is go over to fonts.google.com, you'll
notice that the font is available on
Google Fonts, so that means, if we go
our settings in our project we click
on fonts, we'll be able to simply find
Archivo Narrow font face, we select
that, and will automatically get that
installed directly into our project,
including all the different sizes right.
So regular, italic, and different bold
sizes. The other thing we wanna do
is upload the font Sovereign that
we've downloaded from our brief
in Milanote, and upload that.
You wanna upload the actual font
over, if its a custom font and it's not
available both in fonts and Adobe
fonts, or if it's licensed directly with
the client, you can just uploaded
directly there, and you'll notice
how it now gets install with the original
400 which is the normal size.
If you have already set up your adobe
fonts account, you can access you adobe
fonts API tokens, pull out the token and
install it directly into your project for you
to pull out some of the project typekits,
these typekits will enable you to install
to use specific fonts license by Adobe,
which is really handy.
We wanna make sure we have all
those fonts installed before we
even start playing with the designer
All right guys so let me go ahead
and explain to you some limitations
that Webflow does have, so I'll see
you on the next lesson.
Everything you need. 🥳 Forever Free.