AboutTunnel Vortex brings a mesmerizing, three-dimensional depth to your Framer projects by transforming standard images into an immersive visual journey. Drop it into a hero section, a brand showcase, or a landing page to create a high-end interactive experience that draws visitors into your content through a spinning, endless tunnel effect.
What it doesIt generates a series of image rings that form a hollow vortex, moving smoothly along the Z-axis to create a sense of infinite travel. The component responds to mouse movement with a subtle tilt, giving the scene a true 3D perspective. It handles complex entrance animations, provides customizable hover tooltips for every image, and includes advanced lighting and material effects to ensure the visuals look premium and polished.
What you can customizeVortex GeometryFine-tune the number of rings and cards per ring to find the perfect density. You can also adjust the start and end radius, the total tunnel length, and the perspective depth to control exactly how the vortex feels.
Motion and InteractionSet the tunnel travel speed and rotation velocity to match your site's energy. Enable or disable the mouse tilt effect and manual camera controls to give your users a sense of agency as they navigate the space.
Visual StylingCustomize card sizes, border radii, and fade distances for a soft, professional look. You can also choose between different material finishes like metallic and apply specific lighting effects or color schemes to fit your brand.
Tooltip DetailsFull control over the hover experience including tooltip text, background colors, fonts, and precise pixel offsets. You can even adjust the tooltip radius and padding to keep your UI consistent.
Great forImmersive hero sectionsPhotography and brand portfoliosProduct feature highlightsInteractive landing page backgroundsDynamic storytelling and "About" pages
Share your buildIf you ship something cool with it, post it on X and tag me @Dulajweb , or send it over. I’d love to see what you create.
Need help?Questions or feedback? Reach me anytime: dulajdilshan766@gmail.com or on X @Dulajweb
Dulaj dilshan
