Back to Components
Components
Parallax Scroll
Layered parallax scroll card that offsets shapes at different speeds.
Parallax
Parallax scroll focus
Layered shapes move at different speeds to create depth as you scroll.
Velocity
1.3x
Depth
240px
Cadence
Smooth
Dependencies
- clsx
- tailwind-merge
Files
- components/ui/parallax-scroll.tsx
Installation
Using shadcn CLI
npx shadcn add parallax-scroll --url https://ui.hampton.ioManual installation
Copy the component file to your project and install dependencies:
npm install clsx tailwind-merge