In this guide, you'll learn how to use your own Font assets in Widget Blueprints that contain Text.
Steps
Follow the steps below to see how to assign your own Fonts to be used with the UMG UI Designer.
For this how-to guide, we are using the Blank Template project, using no Starter Content, with default Target Hardware and Project Settings.
-
To create a new Widget Blueprint, from the Content Browser click on the Add New button, then hover over User Interface, and then click on Widget Blueprint selection. This will create a new Widget Blueprint. Make sure to give it a name that you can easily locate later.
-
Go back to the Content Browser where you saved your Widget Blueprint and double-click on it to open it up. In the Widget Blueprint's Palette, select a Text widget and drag it onto the graph. Then grab the corner and scale it to a larger size.
-
Now that you've created your Text Widget, you can click on it and access the Details panel, under Appearance, you'll see a Font option where you can change the font type, it's styling (regular, bold, itallic, etc.), and its size.
-
By default, the Engine uses the Roboto font, however, if you click the dropdown menu, any Composite Font assets created can be selected and used instead.
You can also choose to create a Composite Font from this menu and specify where the new asset should be saved (it will be blank by default, requiring you to fill it out).
-
Once you select your Composite Font, the second dropdown menu will allow you to select a font to use from the Default Font Family.
You can also specify the size of the font in the input box.
Currently, UMG only supports Runtime cached font assets. Also, if you have assigned fonts using the old method, none of your existing file-based font settings will be lost, however going forward, you will need to create a Composite Font asset in order to use custom fonts with UMG.
End Result
Now that you've successfully used your fonts in UMG, you can head over to learn how to style your Fonts by setting colors, Materials, and outline properties (as well as by using shadows).