Container Scroll Animation
A scroll animation that rotates in 3d on scroll. Perfect for hero or marketing sections.
Installation
Run the following command
npx shadcn@latest add @aceternity/container-scroll-animationProps
| 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. |
Build websites faster and 10x better than your competitors with
Aceternity UI Pro
Next.js 15, Tailwind CSS v4 and Motion for react powered templates
70+ templates and component blocks combined
Ready to copy paste component blocks, save days of development time
