How To Add Fonts in Figma
So, you finally found the perfect font for your design, but it’s not available in Figma. Considering that Figma offers hundreds of amazing fonts, you may be able to find a close alternative. But why make compromises when you can also add your custom font and create precisely the design you dreamed up?
Here’s how you can add fonts to Figma to make your designs more varied. Stick around for the answers to some common questions as well.
If you can’t find the font you need in Figma’s expansive repertoire, you’ll need to download it and install it on your device. If you use the Figma Windows or macOS desktop app, the fonts installed on your device will automatically appear in your font picker. Browser app users will need to take an extra step before they can enjoy any font on their Figma interface. Unfortunately, ChromeOS and Linux users won’t be able to add their custom fonts to Figma. If you’re a Windows or Mac user, read on.
Add Fonts to Figma on Windows
To use your new font in Figma, you’ll need to download it and install it on your device.
- Download the font you want to import to Figma.
- Go to your Downloads folder and extract the compressed file.
- Open the folder for Windows OS.
- Double click the font file.
- Click “Install” in the popup window.
The font is now available on your device, hence in Figma as well. Restart the application to see the changes.
You can find your installed fonts on Windows by opening your Control Panel, then Appearance and Personalization. Double-click “Fonts” and you’ll see your library.
Add Fonts to Figma on Mac
To install a new font on Mac, follow these steps:
- Download the font of your choice.
- Look for the downloaded file in Finder.
- Extract the compressed file if necessary.
- Open the folder with the files for macOS.
- Double click the font file.
- Click the “Install Font” button in the popup.
After installing the font on your device, it will automatically appear in the font picker in your Figma app. If you can’t see it, restart the app, and it will show up.
Your installed fonts will be in your Font Book app on your Mac. You can disable or remove any font here by selecting it, then clicking “Edit” and the appropriate option in the menu bar.
Adding Fonts to the Figma Browser App
Your local fonts won’t appear by default in the browser app, but you can remedy this with a handy background service. You’ll need to install Figma’s font service, available on their website.
Add your local fonts to the Figma browser app this way:
- Download the font service for your Windows or macOS device.
- Install the application.
- Refresh Figma in your browser.
- Your local fonts will now be in the font picker.
Can I use Google Web Fonts in Figma?
Yes, Figma uses Google’s huge library of Web Fonts by default. You won’t need to install Google fonts to use them in the app. Some Google Web fonts will be in your font picker by default.
What are the best Figma fonts for UI design?
With countless fonts to check out, finding the right one becomes challenging. To save some time, start your search with the best Figma fonts for UI design. Luckily, these are also Google fonts, so they are available to everyone. Figma also provides some tips on pairing the most popular Google fonts to make its users’ jobs easier.
The best sans-serif fonts include:
· Open Sans
For the best serif fonts in Figma, check out:
· Playfair Display
· Crimson Text
Use Any Font in Figma
The right font can make a significant difference in any design, enhancing everything from the readability to the whole atmosphere of the webpage. Figma knows this well and allows you to import any font you want. Download and install the font on your device, and it will be available in the app instantly. The font service will help you out If you use the browser version.
What are your favorite fonts to use in Figma? Are you satisfied with the app’s offer, or are you preparing to install your own set? Let us know in the comments section below.