Animations
Motion-first animation components powered by Motion v12 spring physics. These aren't cheap CSS keyframe transitions — they're real spring simulations that feel natural and respond correctly to interruption.
Peer dependency required
Animation components depend on motion v12+. Install it alongside the package: npm install @animui/ui motion
Magnetic Button
InteractiveA button that physically attracts to the cursor on hover — uses spring physics for a satisfying magnetic pull effect. Perfect for CTAs.
Typewriter
TextAnimates text character by character, with configurable speed, delay, cursor blink, and support for cycling through multiple strings.
Particle Field
BackgroundA canvas-based particle system that responds to mouse movement. Fully configurable particle count, color, speed, and connection lines.
Scroll Reveal
ScrollWraps any element and animates it into view as the user scrolls. Supports fade, slide, and scale effects with configurable thresholds.
Why spring physics?
CSS transition and @keyframes animations are duration-based — they play for a fixed time regardless of context. Spring physics simulations are force-based: the animation feels physically correct, responds naturally to interruption, and scales with the distance of movement.
Motion v12 (the package formerly known as Framer Motion) provides the spring engine. Steal Shadow configures the spring stiffness, damping, and mass for each component to feel premium without being slow.