Animation Techniques

CSS transitions and animations work as native browser CSS. Framework-level Web Animations API helpers are available through the optional sprig-framework/animation add-on:

import { animate, enableLifecycleTransitions } from 'sprig-framework/animation';

animate(element, [{ opacity: 0 }, { opacity: 1 }], { duration: 180 });
enableLifecycleTransitions();

The opt-in lifecycle hook supports page outlets, conditional branches, and keyed list rows. It respects prefers-reduced-motion by default. See Animations for detailed API and lifecycle behavior.

Animation Techniques ​

Animation Techniques