Unity rich text tutorial

Text in Unity is a little underpowered. But you can make some good-looking UI with the basic settings and Unity rich text formatting. The basic Unity text allows you to add basic things like font size, font type, alignment, and color.

Rich text formatting allows you to add HTML tags to Unity text, but there are only limited options that you can add. In this post, we will cover how you can make a good-looking text UI with the options available in Unity.

First, let’s add a text element to the scene. You can add text using the Gameobject>create>other> UI>text option. Once you have added it you will see a text element in the hierarchy. Select the UI Gameobject and you can see the options in the inspector window like the one in the image below.

Unity gives you the option to change the font, font style, font size, alignment. It also has the option to wrap text. Material is one option that many people underestimate. You can get a theme-based UI with the material option. Unity asset store has a lot of UI materials that you can use to get the right-looking UI for your game.

Raycast target is used when you want the text to be clickable. Most people use buttons for this purpose, but in some scenarios, text looks like the best fit. Don’t enable this option if you don’t want your text to work as a button. Raycast target is enabled by default when you add a text object to your hierarchy, don’t forget to disable it. Many texts with Raycast targets can add to performance issues. You might not notice it in smaller games but when you are making complex games every aspect that can boost performance needs to be addressed.

Unity Rich Text

You can see a check box in the above image that says the rich text. Normally if you enable it, you won’t see any difference in the text you have added. What it does is, it enables markup text formatting options. Markup text is similar to HTML formatting. You can do a lot of innovative things with this. Let’s see what options are available and how to use them.

1.BOLD, Italics and Size

As you can see in the Unity inspector, there is no option to make the text bold or italics. With the Unity rich text option, you can do it. You can use “<b>” to make some characters bold., “<I>” is used for italics, and “<size>” is used for font size. Font size can also be set using the inspector window but if you want a certain portion of the text in a different size you can use the “<size>” attribute.

For example, you can type ” <b>This</b> is a <i>test</i> <size=50>sample</size>”. This way you make your text look better than the plain version that comes by default.

2. Material, Color and quad

HTML tags <color>, <material>, <quad> are used to specify the color, material and quad for the text.

The main reason to use rich text formatting is to get different styles for words in a single sentence similar to the size attribute. Let’s see an example for a better understanding.

Let’s take the sentence ” Unity Rich Text is really useful” and apply different styles to different words. Enter this in the text box to test ” <color=”blue”><b>Unity</b> <I> Rich</I> text is really useful<\color>”. The output will look like this

Unity Rich Text is really useful

Your imagination is the limit with these options. You can play around with the text in different ways. Have fun formatting text and come up with your own innovative text UI. You can check out the best UI assets for more formatting options.