Skip to content

Instantly share code, notes, and snippets.

@canxerian
Last active April 16, 2024 14:29
Show Gist options
  • Save canxerian/eb59bd175077757365ae191c29ded401 to your computer and use it in GitHub Desktop.
Save canxerian/eb59bd175077757365ae191c29ded401 to your computer and use it in GitHub Desktop.
How to use glyph icons with TextMeshPro
This guide shows how you can you use icon fonts in TextMeshPro
1. Copy the font file (.ttf) and copy it a location inside your Unity assets folder. I found my font file here: ‪C:\Windows\Fonts\SegoeIcons.ttf
2. In Unity, navigate to:
Window > TextMeshPro > Font Asset Creator
Select the font file you just copied to your project in "Source Font File"
3. Find the Unicode representation of your icon, these can be found on this website, for example: https://docs.microsoft.com/en-us/windows/apps/design/style/segoe-ui-symbol-font
Enter this Unicode to in to the text area labelled "Character Sequence (Hex).
Use commas for multiple Unicodes, e.g: E7E8,E711
Click "Generate Font Asset". Save this asset
4. Now use your icon in your scene:
Create an instance of a TextMeshPro text component
Select the font created in step 3.
In the text area, enter \uE710, (replace E710 with whichever icon you wish to use)
Now enjoy crisp icons that scale to whatever size, using the power of TextMeshPro's signed distance fields!
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment