Sometimes we just want the full range of FontAwesome fonts to use in our Unity app and so here’s a quick tutorial of how to do it using TextMesh Pro.

Setup

First we need to add the font to our project and set up the package. If you’ve not already got TextMesh Pro then fire up the package manager and add it. It’s usually in the default packages and installed with Unity so you don’t need to download it.

Add the font files

Once we’ve installed TextMesh Pro we need the actual font file that you’re going to use from FontAwesome. You can only do this if you have the Pro license by downloading the desktop files from the fontawesome website.

Once you’ve done this, drag the OTF file that you want to use into your application and accept the default settings. I’m using the Regular-400 font for my app.

Using the Font Asset Creator

Next we need to use the font asset creator to create a TMP Font Asset which is basically a huge sprite sheet that TextMesh Pro uses. To do this we first need to open the Font Asset Creator window by going to Window->TextMeshPro->Font Asset Creator as seen below:

Once there we’ll see the Font Asset Creator window as follows:

First select the font in the Source Font File selection box that we imported earlier.

Next we need to find all of the hex codes for the fonts we need and enter them as a comma separated list into the Character Sequence (Hex) box in the dialog. It’s always more optimal to pick the characters that you want to include in your font file from the FontAwesome website as this will result in a smaller TMP Font asset.

To find the fonts you want, use the standard search functionality in the Font Awesome website and make sure you’ve got the cheat sheet button turned on as shown in the image below:

If the cheat sheet is turned on then the hex code appears below the search result.

If you’re only importing a limited number of fonts then you can leave the default settings in the Font Asset Creator window as follows:

• Sampling Point Size: Auto Sizing

• Padding: 5

• Packing Method: Fast

• Atlas Resolution: 512 x 512

We do however need to change the character set to: Unicode Range (Hex).

Once you’ve got all the codes in that you want, hit the Generate Font Atlas button and the font will generate.

Once the font has generated hit Save and save the resulting file in your application.

Import the entire set

If you want to import the entire Font Awesome Pro set then here’s a handy cheat sheet for the whole sequence for you to copy and paste into the Character Sequence (Hex) box:

If you do this you’ll need to change the Atlas Resolution to 4096x4096 and the packing method to Optimum as it’ll produce a large sprite atlas and will take a while.

Using the fonts

Now the fun part, using the fonts. Using them is as simple as finding them. Find the hex code for the font that you want to use in the FontAwesome website as described earlier.

Next add your button or text to the UI. For this example I’m using a button by choosing Button - TextMeshPro.

Once the control is added, open the TextMeshPro panel in the inspector and add the hex code for your button preceeded by a \u. For example, I’m using the sync-alt icon which has a hex code of f2f1 and so I’ve entered \uf2f1.

Make sure the font asset we created earlier in the Font Asset Creator window is selected in the Font Asset dialog and your icon should appear.

That’s it folks. A quick way to use Font Awesome in your apps.