How to Add Fonts to Figma
How to add fonts to Figma: search the built-in Google Fonts library, install local fonts in the desktop app, or run the font installer for the browser.
Quick answer: Figma loads the full Google Fonts library automatically, so just search the font picker. For a font not in Google Fonts, install it on your computer and use the Figma desktop app, or install the Figma font installer (Font Helper) to let the browser version see your local fonts.
Figma pulls fonts from two places: its built-in Google Fonts library and the fonts installed on your own computer. Knowing which one you need saves a lot of confusion, because the steps are completely different. This guide covers both, plus the detail people miss most often: how local fonts reach the browser version.
Google Fonts: already built in
You do not need to install anything to use a Google Font. Figma loads the entire Google Fonts library for you.
- Select a text layer, or press T and draw a text box.
- In the right-hand panel, open the font family dropdown.
- Start typing the font’s name and pick it from the results.
This works in both the browser and desktop versions. You do need to be online for the Google Fonts list to load. If a name does not appear here, the font is probably not part of Google Fonts, and you will use one of the local-font routes below.
Local fonts in the Figma desktop app
The desktop app reads the fonts installed on your operating system, so this is the simplest route for a custom or purchased font.
- Install the font on your computer. On Windows, right-click the .ttf or .otf file and choose Install. On a Mac, double-click the font file and click Install Font.
- Fully quit and reopen Figma. The app checks your system fonts when it launches, so a font installed while Figma is running will not appear until you restart it.
- Open your file, select a text layer, and search for the font in the picker.
If it still does not show up after a restart, restart your computer and try again, which clears up most stubborn cases.
Local fonts in the browser version
The browser version cannot see your installed fonts on its own. To bridge that gap you install Figma’s font installer, sometimes called the Font Helper.
- In Figma, open the font picker and look for the prompt to install local fonts, or download the font installer from Figma’s help pages.
- Install it and make sure it is running in the background.
- Reload your Figma tab, then search for your locally installed font in the picker.
The helper simply reports your installed system fonts to the browser tab, so the font still has to be installed on your computer first, exactly as in the desktop steps above.
The catch with shared files and teams
This matters more than it sounds. A local font lives on your machine. If a teammate opens a file that uses a font they do not have installed, Figma flags it as a missing font and substitutes something else. For shared work, everyone who edits the file needs that font installed, or you should stick to Google Fonts, which everyone can load automatically.
On licensing: only install fonts you are allowed to use, and remember that a desktop licence does not always permit sharing the file around a team. Google Fonts avoids this problem entirely, and you can download any of them free from fonts.google.com before installing locally if you want them offline.
A quick way to decide which route you need
Before installing anything, it is worth narrowing down which path applies to you, because it saves time:
- Is the font in Google Fonts? Search the font picker. If it shows up, you are done, nothing to install, and it works everywhere including for teammates.
- Not in Google Fonts, and you use the desktop app? Install the font on your computer and restart Figma.
- Not in Google Fonts, and you use the browser? Install the font on your computer and run the Figma font installer.
Working through those three questions in order will resolve the large majority of font situations in Figma without guesswork.
Previewing and organising your fonts
The font picker in Figma lets you type to filter, which is far quicker than scrolling when you know the name. If you only want to see a subset, some versions of the picker let you filter the list to show just Google Fonts or just the fonts on your system, which helps when the full list feels overwhelming. Because local and Google fonts appear together, giving your installed fonts recognisable names on your computer makes them easier to spot here.
If you work with variable fonts, note that support depends on the font itself and the Figma version. When a font exposes weight or width axes, you will usually see those options once the font is selected, but a static version of the same family is a dependable fallback if the axes do not appear.
One last habit worth forming: keep a short note of which fonts a project depends on, especially the local ones. When you hand a file to someone else, or open it on a different computer months later, that list tells you exactly what needs to be installed before the design renders correctly. It is a small step that prevents the surprise of missing-font warnings down the line.
Frequently asked questions
Do I need to install Google Fonts for Figma?
No. Figma loads the entire Google Fonts library automatically. Just open the font picker in a text layer and search by name while you are online. Installation is only needed for fonts that are not part of Google Fonts.
Why does my newly installed font not show in Figma?
The desktop app only reads system fonts when it starts, so you must fully quit and reopen Figma after installing a font. If it still does not appear, restart your computer. In the browser, you also need the Figma font installer running.
Can the browser version use my own fonts?
Yes, but only after you install the Figma font installer (Font Helper) and keep it running in the background. The font must also be installed on your computer. Without the helper, the browser version sees Google Fonts only.
Why do teammates see a missing font?
Local fonts are installed per computer. If a collaborator does not have the same font installed, Figma marks it missing and substitutes another. For shared files, have everyone install the font, or design with Google Fonts so no installation is required.
Where can I get free fonts for Figma legally?
Google Fonts is the safest free source and is already built into Figma. You can also download Google Fonts from fonts.google.com to install locally. Always check a font’s licence before using fonts from other sites.