Introducing Aceternity UI Pro - 70+ premium component packs and templates to build amazing websites.
Logo

Hero Parallax

A scroll effect with rotation, translation and opacity animations.

Open in

The Ultimate
development studio

We build beautiful products with the latest technologies and frameworks. We are a team of passionate developers and designers that love to build amazing products.

Moonbeam

Moonbeam

Cursor

Cursor

Rogue

Rogue

Editorially

Editorially

Editrix AI

Editrix AI

Pixel Perfect

Pixel Perfect

Algochurn

Algochurn

Aceternity UI

Aceternity UI

Tailwind Master Kit

Tailwind Master Kit

SmartBridge

SmartBridge

Renderwork Studio

Renderwork Studio

Creme Digital

Creme Digital

Golden Bells Academy

Golden Bells Academy

Invoker Labs

Invoker Labs

E Free Invoice

E Free Invoice

Installation

Run the following command

npx shadcn@latest add https://ui.aceternity.com/registry/hero-parallax.json

Props

HeroParallax

PropTypeDescription
productsArrayAn array of product objects. Each object should have a title (string), link (string), and thumbnail (string).

ProductCard

PropTypeDescription
productObjectAn object representing a product. It should have a title (string), link (string), and thumbnail (string).
translateMotionValue<number>A Framer Motion value representing the translation of the product card on the x-axis.

Build websites faster and 10x better than your competitors with Aceternity UI Pro

With the best in class components and templates, stand out from the crowd and get more attention to your website. Trusted by founders and entrepreneurs from all over the world.

Go Pro
Manu was such a pleasure to work with. Talented, communicative and fast. Highly recommend!

Jonathan Barshop

Founder at Barshop Studios

A product by Aceternity
Building in public at @mannupaaji