UI Toolkit: Tween Engine

Unity 6 UI Toolkit has no built-in tween engine and no @keyframes support. You write element.schedule.Execute(...) loops, hand-roll easing math, manage cleanup yourself, and watch tweens leak when an element gets removed mid-animation. Designers can't author motion without writing C#. This asset is the missing animation layer. Animate any UI Toolkit property from a single line of C# — button.TweenScale(1.2f, 0.25f).SetEasing(EaseType.EaseOutBack). Or write declarative @keyframes in USS and watch elements auto-animate the moment a class is applied. Same engine drives both paths, so a curve you pick in C# behaves identically to the same curve named in USS. One-line tweens. element.TweenOpacity(1f, 0.3f).SetEasing(EaseType.EaseOutCubic); button.TweenScale(1.2f, 0.25f).SetEasing(EaseType.EaseOutBack); card.TweenTranslate(0f, -20f, 0.4f).SetDelay(0.1f); await element.FadeIn(0.3f).ToAwaitable(); Every property tween returns a TweenHandle for chaining (SetDelay, SetLoops, From, SetRelative, OnComplete, OnKill), control (Play, Pause, Kill, Complete, Restart), and async (ToAwaitable). 30+ animatable properties cover the full UI Toolkit style surface: transforms, sizes, positions, spacing, borders, colors, text, layout. Declarative @keyframes in USS. @keyframes pulse { 0% { scale: 1.0 1.0; } 50% { scale: 1.05 1.05; } 100% { scale: 1.0 1.0; } } .heartbeat-card { animation: pulse 1s ease-in-out infinite; } Full CSS @keyframes syntax — duration, delay, iteration count (including infinite), direction (normal, reverse, alternate, alternate-reverse), fill-mode (forwards, backwards, both), play-state, plus the animation shorthand. Add a class to an element, the animation starts. Remove the class, it stops. No per-element C# wiring. 32 named easing curves — shared between C# and USS. button.TweenScale(1.2f, 0.5f).SetEasing(EaseType.EaseOutBack); // from code .bounce-in { animation: pop 0.4s ease-out-back forwards; } /* same curve, from USS */ Linear, sine, quad, cubic, quart, quint, expo, circ, back, elastic, bounce, plus damped spring — all 32 reachable as EaseType.X in C# and as kebab-case keywords in USS (ease-out-back, ease-out-bounce, ease-in-out-elastic, spring, …). Same math under both names. Plus full CSS cubic-bezier(x1, y1, x2, y2) and steps(n, start|end) for the cases where the named curves aren't enough. 22 presets — fade, slide, scale, shake, pulse, bounce, heartbeat, jiggle, flash, typewriter, and more. One call: card.FadeIn(0.3f), card.SlideInLeft(0.4f), card.ShakeHorizontal(0.5f, 10f), card.Bounce(0.6f), text.TypeWriter(0.05f). Every preset returns a TweenHandle you can await, chain, or control. The USS side ships a parallel preset library — 13 .tw-* classes (.tw-shimmer, .tw-pulse, .tw-glow-border, .tw-spin, .tw-fade-in, .tw-slide-in-left/right/top/bottom, .tw-bounce-in, .tw-shake, .tw-color-cycle, .tw-skeleton-loading, .tw-attention-ring, .tw-float) that drop a polished animation onto any element without writing a @keyframes block yourself. Sequences for composed motion. TweenSequence.Create() .Append(card.FadeIn(0.3f)) .Append(card.TweenScale(1.05f, 0.2f)) .Join(card.TweenBackgroundColor(highlight, 0.2f)) .OnComplete(() => Debug.Log("done")); Append for chained, Join for parallel, Insert for time-positioned, plus four stagger directions (first-to-last, last-to-first, center-out, edges-in) for collection animations. Await a whole sequence or any subset with WaitForAll / WaitForAny. Auto-cleanup on element detach. Every tween and every keyframe animation silently disposes itself when its target element leaves the panel. Stop your scene, swap panels, destroy a UIDocument — there are no leaked update callbacks, no orphaned coroutines, and you didn't write a single cleanup line. Need explicit control? Hold the returned handle and kill it yourself. Two demo scenes included. TweenDemo — every property tween with a toggle button, every preset wired up, a 31-curve easing visualizer animating side-by-side, a sequence builder demo (App