About
A scroll-based image gallery that creates depth and dimension through dynamic scaling animations. As users scroll, images scale up at different rates while a text overlay fades in, creating an engaging visual narrative. Perfect for landing pages, portfolios, and immersive storytelling experiences. Built with React, TypeScript, and Framer Motion.
Built with React and Tailwind. Copy the prompt and paste it into Claude Code, Cursor or Lovable: your agent adds Immersive Scroll Gallery to your project and fits it to your theme.
Code
How Immersive Scroll Gallery is used: the demo's code. The component's own source comes with a free account.
Usage.tsx
import ImmersiveScrollGallery from "@/components/ui/immersive-scroll-gallery.tsx";
const DemoOne = () => {
return (
<div className="mx-auto relative h-dvh">
<ImmersiveScrollGallery />
</div>
);
};
export { DemoOne };











