Animations

LUI animates with Unity UI Toolkit’s native transitions, so animations are GPU-eased and cost nothing per frame. The system covers enter animations (played once when an element mounts) and interaction presets for hover:/active:/focus:.

Enter Animations

Add an enter-* (or animate-*) class and the element animates in the first time it is created:

Lui.Div("enter-pop", Lui.Text("Ready"))
Lui.Image(portrait, "enter-fade duration-500 ease-out")

Available enter presets:

enter-fade         animate-fade
enter-pop          animate-pop
enter-zoom         animate-zoom
enter-slide-up
enter-slide-down
enter-slide-left
enter-slide-right

Timing reuses the normal utilities: duration-* sets the duration in milliseconds and ease-* sets the curve. When omitted, the theme defaults (animDurationMs, animEase) apply.

The fluent form gives typed control over duration, delay, and easing (useful for staggering):

Lui.Div("...").Enter("slide-up", durationMs: 250, delayMs: 40, easing: LuiEase.OutBack)
Lui.Div("...").Enter(LuiEnterKind.Pop)
Lui.Div("...").Animate("fade")

Enter plays once per element instance, at creation. It does not replay on rerender. To replay it, remount the subtree by changing its .Key(...).

Interaction Presets

Presets are named macros that expand to transform utilities under a variant. Add a transition class so they ease:

Lui.Button("Play", "transition-transform hover:lift active:press", OnPlay)
Lui.Div("transition focus:glow").OnClick(Select)

Available presets:

lift     translate up slightly
press    scale down
grow     scale up
sink     scale down + nudge down
glow     focus ring highlight

They also have a fluent form that applies the same presets without putting them in the class string:

Lui.Button("Play", "transition-transform", OnPlay).Hover("lift").Active("press")

Theme Defaults and Reduced Motion

LuiTheme controls animation defaults:

• animDurationMs - default enter duration when none is given.
• animEase - default enter easing (LuiEase).
• reduceMotion - when enabled, enter animations resolve instantly.

Available Easings

LuiEase.Linear
LuiEase.In
LuiEase.Out
LuiEase.InOut
LuiEase.OutBack
LuiEase.OutBounce

ease-linear, ease-in, ease-out, and ease-in-out map to the corresponding LuiEase values when set through class strings.