3D Glow Carousel

Showcase interactive media cards in a curved 3D deck with real-time glow, smooth drag physics, and responsive auto-framing. Built for sleek tech and SaaS sites.

Features

• Interactive curved 3D card layout

• Multi-pass GLSL edge glow and spectrum aura

• Hardware-accelerated Three.js rendering

• Direct video and image playback support

• Inertial touch and pointer drag controls

• Native keyboard and trackpad wheel navigation

• Procedural fallback textures for zero asset-load delay

• Smart viewport pausing and context-loss recovery

• Accessible prefers-reduced-motion integration

• Fully responsive canvas scaling across all breakpoints

Customization Options

• Card width and height

• Card center spacing

• Corner radius and 3D tilt angle

• Dynamic card bend curvature

• Outer aura glow intensity

• Film grain texture overlay

• Canvas render sharpness (pixel ratio)

• Autoplay duration, delay, and step count

• Drag interaction and hover-pause toggles

• Image fit modes (cover and contain)

How to Use

• Drop the component onto your Framer canvas

• Add your custom images or MP4/WebM videos

• Adjust card dimensions, curvature, and center spacing

• Fine-tune the aura glow and grain to match your palette

• Set your preferred autoplay intervals and drag physics

• Publish to deliver an immersive 3D browsing experience

Use Cases

• AI product feature showcases

• Creative portfolio project sliders

• High-ticket SaaS hero sections

• Digital agency client work reels

• Dark-mode landing page highlights

• Video case study decks

• Interactive product feature galleries

• Web3 and fintech dashboard overviews