About Card3DTunnelSlow

Preview - https://card3dtunnelslow.framer.website/

About

3D Card Tunnel adds a deeply immersive, looping layered environment directly to your Framer projects. Drop it into a hero section, a landing page, or a feature showcase to instantly capture attention with a cinematic sense of depth. Your cards stack and move through a continuous three dimensional space, drawing visitors deeper into your content as they explore your site.

What it does

Creates a dynamic tunnel effect using sequential layers that automatically pull forward or react directly to page scrolling. It smoothly handles image depth, manages loop resets for non-stop movement, and blends distant layers with a customizable blur and fog effect. The component is fully responsive, meaning your 3D tunnel will scale naturally and look great across mobile devices, tablets, and large screens.

What you can customize

Tunnel layout: Total number of depth levels, the precise Z spacing between each card, and the overall perspective intensity.
Motion and flow: Toggle auto pull on or off, adjust the pulling speed, enable scroll reactivity, and turn looping on for endless animation.
Atmosphere: Turn background fog on or off, pick a custom fog color to match your brand, toggle an outer vignette, and set the blur strength for distant cards.
Card styling: Exact card width and height, corner radius smoothing, and horizontal X spread to offset your items.

Great for

Hero headers and intro sections
Product feature and benefit showcases
Creative portfolios and agency sites
Immersive storytelling landing pages
Visual galleries that need an extra pop

Share your build

If you build something awesome with this, share it on X and tag me @Dulajweb or send it my way. I would love to check out what you create.

Need help?

Have any questions or feedback about setting it up? Reach out anytime at dulajdilshan766@gmail.com or find me on X @Dulajweb