Container Scroll Animation

A scroll animation that rotates in 3d on scroll. Perfect for hero or marketing sections.

Unleash the power of
Scroll Animations

npx shadcn@latest add @aceternity/container-scroll-animation

Component	Prop	Type	Description
ContainerScroll	`titleComponent`	`string \| React.ReactNode`	The component or string to be used as the title.
ContainerScroll	`children`	`React.ReactNode`	The children components to be rendered inside the ContainerScroll component.
Header	`translate`	`MotionValue<number>`	The motion value for translation to be applied to the Header component.
Header	`titleComponent`	`string \| React.ReactNode`	The component or string to be used as the title in the Header component.
Card	`rotate`	`MotionValue<number>`	The motion value for rotation to be applied to the Card component.
Card	`scale`	`MotionValue<number>`	The motion value for scaling to be applied to the Card component.
Card	`translate`	`MotionValue<number>`	The motion value for translation to be applied to the Card component.
Card	`children`	`React.ReactNode`	The children components to be rendered inside the Card component.

Next.js 15, Tailwind CSS v4 and Motion for react powered templates

200+ templates and blocks combined

Ready to copy paste component blocks, save days of development time