Blog

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

Discover ways to add fonts to Figma to create distinctive net designs.

Selecting the best font for our design generally is a recreation changer. Good typography not solely makes your message readable, however it may outline the persona of your model.

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

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

On this tutorial I’ll present you in three easy steps how one can add fonts to Figma. 

Get a Figma Fast Begin Information

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

You can too take a look at all of the Figma-related video tutorials on Envato Tuts+ YouTube channel.

The best way to Add Fonts to Figma in 3 Steps

Questioning how one can a add a font to Figma? It’s really simpler than you assume. Comply with these three steps and get inventive along with your design:  

1. Select Your Font and Set up It

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

You may obtain it at no cost from websites like Google Fonts. Or you possibly can go for one thing distinctive within the font library on Envato Parts.

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

Working with a novel font can add sparks of persona to your net design. Irrespective of in case you’re designing from scratch or working with a Figma template. Typography is likely one of the foremost design components to think about.

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

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

Questioning how one can add Adobe Fonts to Figma? Comply with the identical steps to search out out. 

2. Obtain The Figma Font Installer

Now, to discover ways 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. 

That is in case you’re engaged on the Figma net app. The desktop app doesn’t require the font installer.

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

3. Refresh and Begin Utilizing Your Font! 

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

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

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 begin utilizing my font.

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

I’ll go to Textual content on the suitable aspect 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 with the Monigue font I selected from Parts. 

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 completely different net designs. 

The excellent news is you don’t have to create them from scratch. Go to Envato Parts and discover the very best Figma template on your design challenge. 

You can too improve your design with fonts, photos and graphics. Discover all of them on Envato Parts. 

Extra Figma Assets and Tutorials

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

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