How to Add Fonts to Figma in 3 Steps

Don’t restrict your design choices to preset fonts! Discover ways to add fonts to Figma to create distinctive designs. 

Choosing the proper font for our design generally is a recreation changer. Good typography not solely makes your message readable, however it might probably outline the persona of your model.

As Adi Purdilla says: “In case your typography seems to be dangerous, that’s going to translate to the entire thing.” If you happen to’re getting began, I like to recommend you to observe our newbie’s guide to web design.

All that being mentioned, you don’t should restrict your choices to the preset fonts accessible in Figma. Go above and past along with your creativity by including distinctive fonts to your design. 

Get a Figma Fast Begin Information

On this Figma video tutorial, you’ll be taught every little thing it’s good to get began with Figma. In simply 47 minutes, Adi Purdila will information you thru this fast and easy-to-follow tutorial:

You may also try all of the Figma-related video tutorials on Envato Tuts+ YouTube channel.

Learn how to Add Fonts to Figma in 3 Steps

Questioning how you can a add a font to Figma? It’s truly simpler than you assume. Observe these three steps and get artistic along with your design:  

1. Select Your Font and Set up It

First issues first. Earlier than studying how you can add fonts to Figma, you need to find the font you’d wish to work with.

You possibly can obtain it totally free from websites like Google Fonts. Or you possibly can go for one thing distinctive within the font library on Envato Elements.

On this case, I’ll be working with Monigue – Condensed Sans Font.

Working with a novel font can add sparks of persona to your internet design. Regardless of when you’re designing from scratch or working with a Figma template. Typography is without doubt one of the essential design components to think about.

Unsure what font to go for? Get some inspiration from this pattern:

When you selected your font, go forward and set up it in your laptop. 

Questioning how you can add Adobe Fonts to Figma? Observe the identical steps to seek out out. 

2. Obtain The Figma Font Installer

Now, to learn to add fonts into Figma, we have to obtain a font installer. 

Go to Figma Downloads and choose the working system you’re employed with. 

As soon as the Figma Agent is put in, you’ll have the ability to use your native fonts within the internet app. 

3. Refresh and Begin Utilizing Your Font! 

It’s time to see the magic occur. That is how you can add a font to Figma.

For this tutorial I’m working with the Hero Header Design Figma template from Envato Components.

Now that I’ve my font downloaded and the Figma Agent put in, I’ll go to my Figma template in my browser. I’ll reload the file to start out utilizing my font.

Then, I’ll choose the textual content I’d like to vary to my new font.

I’ll go to Textual content on the correct facet column menu and click on on the font title.

From right here, I can seek for my newly put in font in Textual content search bar and voilà! Now you know the way so as to add fonts to Figma.

That’s how the design seems to be with the Monigue font I selected from Components. 

Kick Off Your Design Venture With a Figma Template

Now that you know the way so as to add fonts into Figma, you may wish to experiment with totally different internet designs. 

The excellent news is you don’t have to create them from scratch. Go to Envato Components and discover the perfect Figma template to your design venture. 

You may also improve your design with fonts, images and graphics. Discover all of them on Envato Components. 

Extra Figma Assets and Tutorials

Studying how you can add fonts to Figma is only the start. Get a step forward of the online design recreation.

Be taught new methods and tendencies from these articles and tutorials: