How to use fonts in Webflow

Besides the 26 default system fonts, we support over 600+ Google Fonts, 4200+ Adobe Typekit fonts, and any custom fonts that you have the right to use.

NOTE: You'll need a premium Webflow plan or your site's hosting subscription to use Adobe Typekit and custom fonts. Upgrade your Webflow account

How to add Google Fonts to your site

1. Go to the Fonts tab in your Site Settings
2. Choose a Font Family from the Google Web Fonts section, pick the weights you want, then click Add Font
   *For best performance, choose only the font weights you'll actually use.
3. Publish your site, then head back to the Designer and pick the font from the Typography section of the Style tab to use it

How to add Adobe Typekit fonts to your site

1. Open your Account Settings
2. Go to the Integrations tab
3. Add your Typekit Key
4. Click Save Changes
5. Open your Site Settings
6. Go to the Fonts tab
7. Choose your Typekit Kit from the Typekit Kit section
   How to create a Typekit Kit
8. Save and Publish your site

NOTE: If you are having trouble with your Adobe Typekit integration, follow the steps in this article: How to resolve Adobe Typekit integration or syncing errors

How to add custom fonts to your site

1. Open your Site Settings
2. Go to the Fonts tab
3. Find the Custom Fonts section
4. Click Upload
   List of font file types for maximum browser support
   
5. Set font family, weight, and style
6. Click Upload Font File
7. Set Fallback Font Family
8. Save and Publish your site

NOTE: Please read your font’s license agreement and make sure you have permission to use the font with your site before you upload it. Introduction to font licensing and usage