A new addition with Version 6, our ligatures feature allows you to more easily insert icons into a documents text layer. Here's how to get around and use them.

First Things First!

Make sure you’ve set up Font Awesome in your project and are ready to manage some mischief.

Open a Document in Your Desktop App

After completing the steps in set up, open a new or existing document in the Desktop app you want to use Font Awesome icons in. We'll use a new document in Figma for the walkthrough below.

Create a New Text Layer

However your app allows you, create a new layer or text block to insert text into.

A new text layer created in a Figma document

Set the Font/Typeface to Font Awesome 6

Next, using your app's font/typeface selector, find and select "Font Awesome 6 Free" or "Font Awesome 6 Pro" as the one you want to use for the current text layer/block. Remember, if you want to insert a brand icon, choose the "Font Awesome 6 Brands" font/typeface. And if you want to use Duotone, you'll need to add those as SVGs.

Selecting Font Awesome 6 Pro

Type the Icon's Name

Next, you're all set to reference the icon you want to use. Just start typing the icon's name and as you finish, our ligatures should convert the letters into the correct symbol. Geee, Mr. Wizard!

"rocket" typed into the text layer renders the icon

Don't worry if other icons appear as you are typing the text for the icon you want. Once you're done, our ligatures will honor the final word you've typed.

Our icons gallery is a perfect place to easily find the icon you want to use and grab its name.

Adjusting Styles/Weights

Font Awesome 6 comes in 5 styles/weights (plus brands!). If you've installed all .otfs, you can change the weight of your text layer/block to switch between visual styles.

Switching from regular to thin style of rocket using font weight

Exporting and Prepping for Production

Remember to convert these icon text layers to vector outlines or rasterized copies before using the document in some graphic/print design and even web-based production steps. Individuals and services/tools you may be using might not have access to the font files those text layers depend on to render things right.