LogoLogo
Showcase & FeaturesDiscord✨Get on the asset store✨
Text Animations for UI Toolkit
Text Animations for UI Toolkit
  • Text Animations for UI Toolkit
  • Getting Started
  • Animated Visual Elements
  • Text Animation Settings
  • USS Properties
  • Templates
  • Performance Optimization Guide
  • Animations
    • Built-in Animations
    • Custom Animations
  • Typewriting
    • Built-in Text Appearance / Vanishing Animations
    • Typewriter Animation Settings
    • Typewriter Control Tags
  • Events
    • Events
    • Built-in Event Handlers
    • Custom Events
  • C# Extensions
    • Custom C# Animations
    • Custom Event Handlers
  • Technical Details
    • Limitations
Powered by GitBook
On this page
  • Parameter Types
  • Examples
  • Performance cost

Was this helpful?

  1. Animations

Built-in Animations

PreviousPerformance Optimization GuideNextCustom Animations

Last updated 20 days ago

Was this helpful?

Parameter Types

Name
Description

a

Amplitude, the strength of an effect. A higher amplitude creates a stronger effect.

For example: the height of a wave, the amount shake offsets letters.

d

Delay, the time in seconds before the effect starts.

f

Frequency, the speed of an animation. A higher frequency creates a faster effect.

l

Limit, the number of cycles (or seconds for animations without cycles) before the animation stops.

w

Wave Size, for effects that work in waves (<wave>, <rainbow>, etc.). For example, a wave size of 5 means the full wave will be completed after 5 letters.

Examples

Code
Explanation

Example <wave>text</wave>!

text is animated as a wave, it uses default parameters.

<wiggle>Example</wiggle><wave>text</wave>

Example wiggles with default parameters; text waves with default parameters

<wave>Example <swing>text</swing></wave>

Animations can be combined

<wave f=5>Example</wave>

Example waves 5 times per second.

<wave a=3 d=3 f=5 w=10>Example</wave>

Example waves with an amplitude of 3 (very large), a frequency of 5, and a wave size of 10 letters. The animation starts 3 seconds after the text appears.

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 , or join my and I'll try my best to help you!

contact form
Discord
Cover

Tag: <bounce>

Params: a, f, l, w

Cover

Tag: <rainbow>

Params: d, f, l, w

Cover

Tag: <rot>

Params: f, w

Cover

Tag: <shake>

Params: a, d, f, l

Cover

Tag: <size-wave>

Params: a, d, f, l, w

Cover

Tag: <swing>

Params: a, d, f, l, w

Cover

Tag: <wave>

Params: a, d, f, l, w

Cover

Tag: <wiggle>

Params: a, d, f, l

Cover

Params: a, d, f, l, w

Custom Animations