Harsha Vardhan N
Figma offers different fonts to work with, and if you’re finding them limited, it allows the flexibility to add fonts. In this guide, we will help you with adding Google fonts through a demonstration to get you covered.
Add Google Fonts to Figma
- Navigate to Figma and sign in with your credentials. After signing in successfully, click on the New design file button to get started.
- If you have an existing design to work with, look for it in Recently viewed and click on it to open it.
- With the new or existing design loaded, select the existing text box or press T to add a text box to the canvas and enter text into it.
- Doing so, you will find the Design tab updated in the Properties panel on the right. Now, navigate to the Text section and click on the font name.
- In the dropdown that appears when clicking the font name, you can find Figma’s font library. However, there isn’t any option for adding new fonts.
- The lack of an option to add a new font can become confusing, and to make things more complicated, Figma requires you to install the Figma font installer if the desktop isn’t downloaded. This installer detects the newly installed fonts on the device and updates them to the list.
- Once you have installed the Figma font installer, open Google Fonts on a new tab and explore the available fonts.
- After you find the font you like, click on it to open it. Now, look for the Get font button and click on it to download the font.
- Locate the downloaded font with (.ttf or .otf) in the File Explorer and open it by double-clicking. Now, find and click the Install option on the toolbar of the preview window of the font loaded to install it.
- Once you have installed the Google font, refresh Figma and repeat Steps 3-5 to find the font added successfully to the drop-down menu in the Installed by you section and ready to use.
Wrapping Up
Congratulations on learning how to add Google Fonts to Figma!
If you’re having difficulty adding Google Fonts to Figma, first ensure that you have downloaded the correct font file. Also, rename the font to a short one so that Figma recognizes it. If nothing works, reinstall the Font installer, repeat the above steps, and restart your device to install Google Fonts successfully.
Related Reading
How To Change Font Size in Figma
How To Use Font Awesome in Figma
