Built-in Text Appearance / Vanishing Animations

Tag: <fade-in>

Parameters: d

Tag: <fade-out>

Parameters: d

Tag: <offset-in>

Parameters: d, x, y

Tag: <offset-out>

Parameters: d, x, y

Tag: <random-in>

Parameters: a, d

Tag: <random-out>

Parameters: a, d

Tag: <size-in>

Parameters: a, d

Tag: <size-out>

Parameters: a, d

Custom Animations

Parameters: a, d

Custom Animations

Parameters: a, d

Parameter Types

Name	Description
a	Amplitude, the strength of an effect. A higher amplitude creates a stronger effect. For example, the distance a letter moves in random-in or random-out or the target font size (in percent) for size-in and size-out.
d	Duration, the time in seconds until the text has fully faded in or out.
x	X Offset, the amount of horizontal offset.
y	Y Offset, the amount of vertical offset.

Changing text appearance / vanishing speed

The speed at which text is appearing and vanishing can be changed in the Text Animation Settings. Make sure you've added your text animation settings object to your animated text element in UI builder, or the settings will not be applied to your element.

There is also a special control tag (<speed>) for speeding up or slowing down text dynamically, more in Typewriter Control Tags.

Examples

Code	Explanation
Example <fade-in>text</fade-in>!	The word text uses the Fade in text appearance animation. If the Text Animation Settings have default animations, the fade-in is layered on top of them. If the settings has Fallback Animations set up, the fade-in replaces them.
<fade-in><fade-out>Example text	It's not necessary to close the tags at the end, if you want to change text appearance / vanishing animations for the whole text.
<fade-in>Example <size-in a=2>text</size-in></fade-in>	It's possible to layer different kinds of animations.

Performance cost

The type and amount of animations you use should not significantly impact performance. Most of the performance cost is up-front when you set your text and is mostly dependent on the length of your text.

Check out the Performance Optimization Guide for more information.

---

Check out Custom Animations and Custom C# Animations if you want to extend the asset with your own animations.

Is an important animation missing? Or maybe an animation tag doesn't support a parameter you'd like to use? Contact me via the contact form, or join my Discord and I'll try my best to help you!