3D Premium Carousel

3D Premium Carousel
3D Premium Carousel

About 3D Premium Carousel

Add an interactive 3D WebGL media carousel to your Framer site with elastic drag physics, dynamic parallax depth, liquid hover zoom, and seamless video playback.

Features

  • GLSL-powered 3D perspective slider engine

  • Smooth elastic drag and inertial scroll physics

  • Interactive video support with automatic preloading

  • Dynamic edge-to-edge parallax depth movement

  • Liquid hover zoom with centered perspective alignment

  • Touch-optimized native fallback for mobile devices

  • Viewport intersection observer for maximum FPS performance

  • SRGB color space and high-DPI canvas rendering

  • Keyboard arrow navigation and mouse wheel support

  • Fully responsive fluid layout scaling

Customization Options

  • Media list with images, videos, posters, and links

  • Card width percentage and custom aspect ratios

  • Follow motion damping and drag smoothness

  • Scroll wheel and touch drag speed controls

  • Intro entrance animation toggle and duration

  • Parallax depth offset and hover zoom intensity

  • Custom resolution multiplier for GPU optimization

  • Bottom offset spacing and layout padding

How to Use

  1. Drop the component onto your Framer canvas

  2. Add your image and video URLs in the media control array

  3. Adjust card width, aspect ratio, and spacing parameters

  4. Tune the drag elasticity, parallax depth, and hover zoom

  5. Publish your site for a responsive 3D WebGL carousel experience

Use Cases

  • Creative agency portfolio showcases

  • Modern e-commerce product carousels

  • Interactive video galleries

  • High-fashion editorial sliders

  • SaaS feature and testimonial loops

  • Visual brand showcase sections

  • Photography galleries

  • Dark mode visual showcases

From Ameva

Endless 3D Carousel
Spatial 3D Carousel
WebGL Image Ribbon
3D Media Showcase

Related Components

Phone Stack Carousel
Waveflow Carousel
Depth Carousel Pro
Team Folio Pro