Animations/Fade In
Animation

Fade In

Declarative wrapper that fades and translates its children into view on mount.

Drop any content inside <FadeIn> — it animates from translated + transparent to its natural position.

Faded in
Refresh the page to see the animation replay

Install from registry

npx shadcn@latest add https://ui.comcreate.io/r/fade-in.json

Shadcn-compatible registry endpoint served locally for copy-paste installs.

Installed files

  • components/animations/fade-in.tsx