The Ultimate Media Gallery
The Ultimate Media Gallery is an absolute powerhouse. This isn't just a carousel; it's a multi-geometry spatial engine that allows you to bend your media into three distinct 3D formations: a continuous Cylinder, a towering Helix, or an immersive Sphere.
Engineered with high-DPI touch screens in mind, this component completely resolves the classic "carousel vs. page scroll" mobile conflict using precise pan-y pointer tracking. Combine that with real-time ambient color extraction, and you have a component that delivers a hyper-premium, app-like experience straight out of the box.
✨ Key Highlights
Tri-Mode 3D Geometry: Instantly switch your layout between a standard rotating Cylinder, a vertical Helix with customizable pitch, or a fully enveloping 3D Sphere mathematically distributed for perfect spacing.
Intelligent Ambient Glow: The engine automatically reads the pixel data of your images and videos, casting a massive, heavily blurred 3D aura behind each card that perfectly matches its dominant color.
Strict Mobile Scroll Fix: Built with advanced pointer event tracking. If a user swipes vertically, the engine instantly yields to the native page scroll. If they swipe horizontally, it captures the momentum for a buttery-smooth 3D spin.
Double-Sided Rendering: Cards don't just disappear when they rotate to the back. The engine renders a mirrored, backside layer so your media remains visible and physically grounded from every angle.
Interactive Camera Rig: You aren't just adjusting the cards; you are adjusting the "camera." Tilt the entire scene on the X and Y axes, or zoom in and out on the Z-axis to frame the gallery perfectly within your layout.
⚙️ Complete Design Control
Content & Media: Seamlessly mix static images and looping videos. Define custom widths, heights, and corner radiuses, and turn any card into a fully functioning hyperlinked node.
Physics & Momentum: Dial in the exact idle spin speed, reverse the rotation direction, map the spin velocity to the user's vertical page scroll, and fine-tune the drag friction for the perfect tactile release.
Spatial Configuration: Control the exact depth of the scene (Perspective), push cards progressively inward or outward (Z Offset) to create spirals, and define the specific "Hover Pop" distance when a user interacts with a card.
💡 Perfect For
"Vibe Code" Landing Pages: Inject that cutting-edge, highly interactive WebGL feel into SaaS or tech landing pages without actually writing WebGL.
Agency Portfolios: Showcase high-end design case studies or video showreels in a format that proves technical and creative superiority.
Immersive Product Displays: Wrap physical products, fashion collections, or 3D assets in a glowing, interactive sphere.
Share It On :








