Container Scroll

ProNew

A showcase frame that starts tilted back in 3D and flattens to face the reader as it scrolls into view.

Customize

This item has no props to tune. Use the lens above to change theme, density, direction and more.


pnpm dlx shadcn@latest add @tealmac-pro/container-scroll

Prop	Type	Default	Description
`title`	`ReactNode`	-	Heading above the frame. It lifts slightly as the frame flattens.
`container`	`RefObject<HTMLElement \| null>`	-	Scrollable element to track instead of the page.
`tilt`	`number`	`22`	Starting tilt of the frame in degrees.
`frameClassName`	`string`	-	Classes for the frame that holds the children.

Also accepts all <div> props except title.

The animation runs from when the frame enters the bottom of the viewport until its center reaches the middle.
Under reduced motion the frame is flat from the start.