Integration

Animation is a thin enhancement layer. Use it around Primitives, Components, or Blocks when you want motion without introducing a second design abstraction.

import { FadeIn, SlideUp } from '@foundrykit/animation';
import { Button } from '@foundrykit/primitives';

export function HeroActions() {
  return (
    <FadeIn>
      <SlideUp>
        <Button>Get started</Button>
      </SlideUp>
    </FadeIn>
  );
}

Because the package already exposes Framer Motion primitives, you can mix FoundryKit wrappers with lower-level custom motion when you need more control.