How can I ensure that the Typekit fonts I've attached to my project are visible on my page in design mode in Webflow?

Published on

September 22, 2023

Note

CommunityFAQ is not affiliated with Webflow. Click here if you'd like to visit Webflow's help resources.

To ensure that your Typekit fonts are visible on your page in design mode in Webflow, you need to follow these steps:

Sign up for a Typekit account: If you don't already have an account, visit the Adobe Fonts website (previously known as Typekit) and sign up for an account.
Select and sync your fonts: Once you have an account, browse through the wide selection of fonts available and choose the ones you want to use in your project. Click on the "+" button next to each font to add it to your collection. After you have selected your fonts, click on the "Use Fonts" button in the top right corner to sync them to your computer.
Access the Webflow Designer: Log in to your Webflow account and open your project in the Designer.
Navigate to the Fonts settings: In the Designer, click on the gear icon in the top right corner to open the project settings. Then, select the "Fonts" tab.
Enable Typekit integration: In the Fonts settings, scroll down to the "Typekit fonts" section. Here, you will see a toggle button that says "Enable Typekit integration". Turn this toggle button on.
Authenticate Typekit with your Webflow project: After enabling the Typekit integration, you will see a modal asking you to authenticate your Typekit account with your Webflow project. Click on the "Authenticate" button.
Preview and use Typekit fonts: Once authenticated, you will see a panel displaying your Typekit fonts in the Fonts settings. You can now preview and use these fonts by selecting them from the dropdown menus for the different font styles and weights in your project.

By following these steps, you can ensure that the Typekit fonts you've attached to your project are visible on your page in design mode in Webflow. Remember to publish your site for the fonts to be visible on the live website.

Additional Questions:

How do I add custom fonts to my Webflow project?
Can I use Google Fonts in Webflow?
How do I change the font size in Webflow?

How can I improve the background video quality on Webflow?

What could be the reason for the background image not showing on certain devices in Webflow?

Is there a way to reorder elements in each section on Webflow so that they follow the order of Title, picture, description when viewed on mobile portrait view?

Where can I change the text link for each instance of a symbol in Webflow without changing it for all instances?

Is it possible to remove the visible link block behind when clicking on a link in the tablet/mobile version of Webflow for a cleaner user experience?

Is there a way to avoid duplicating classes when duplicating a page in Webflow?

Is it possible to create a webpage with a before and after image feature like the example provided on Shawlands Arcade in Webflow?

Why are some images not displaying on the mobile view in Webflow?

What are the steps to switch from one template to another in Webflow without interfering with a custom domain?

Can I change the click function in Webflow to hover instead?