Font Materials and Outlines

In addition to being able to set a Color and Opacity for your Font in UMG, you can also use Materials and font outlines for additional Font styling.

Font Colors

You can set the Vertex Color for your Font by setting its Color and Opacity.

Without a Font Material specified, this will apply a solid color to your text.

Font Materials

You can specify a Font Material for your Font in the Details panel.

If your Font Material doesn't have a Vertex Color node, the effect is like a simple multiplication.

BaseColorFinalFontMat.png BaseColorFinalDisplay.png

Font Material Setup

Font Material Preview

Final Font

However, if you place a Vertex Color node in your Font Material, you can use its outputs to do math within your shader.

VertexColorFinalMat.png VertexColorFont.png

Font Material Setup

Font Material Preview

Final Font

Materials used as font materials must be in the User Interface domain.

Font Outlines

You can specify a different Outline Color as well as a different Material to use for a font outline.

The size of the outline is specified in Slate units, but when the font's scale is 1.0, 1 Slate unit is equivalent to 1 pixel.

One interesting note is that you can specify whether or not to use Separate Fill Alpha.

When this is enabled, the outline is translucent where the filled area will be, allowing you to adjust the alphas of the font and the font outline independently. When it is disabled, the font is overlaid on the outline, so the alphas are additive and the outline color and Material is visible through a font with an alpha less than 1.

SeparateAlphaOff.png SeparateAlphaOn.png

Font Color Alpha = 0.5, Separate Fill Alpha disabled

Font Color Alpha = 0.5, Separate Fill Alpha enable