CurvedCarousel3D

Overview CurvedCarousel3D is a fully interactive, physics-driven 3D carousel built natively for Framer.

Overview CurvedCarousel3D is a fully interactive, physics-driven 3D carousel built natively for Framer. Cards are positioned on a virtual cylinder using real trigonometric math — giving an authentic curved depth effect without any external libraries. Every interaction feels alive: drag with momentum, auto-rotation, spring easing, and glass-morphic card surfaces. How It Works Each card is positioned around a cylinder using polar coordinates. The X and Z position of every card is calculated using sine and cosine of its angle, so cards curve naturally around an invisible circular track. Scale, opacity, and z-index are dynamically mapped from depth — the front card appears full size and fully opaque, while cards further back shrink and fade proportionally. A spring lerp function smoothly interpolates between the target rotation and the displayed rotation on every animation frame, giving the carousel its signature fluid feel. When you release a drag, a momentum system kicks in — velocity decays gradually through a configurable friction coefficient until the carousel naturally comes to rest. Interaction & Controls Dragging or swiping rotates the carousel using real-time delta tracking with a rolling velocity average for natural responsiveness. On release, momentum carries the rotation forward and decays smoothly. Hovering over the carousel pauses auto-rotation instantly, and rotation resumes when the cursor leaves. Arrow buttons snap to the next or previous card, while dot indicators let users jump directly to any card. Full pointer event support ensures the carousel works seamlessly on touch devices without conflicting with page scroll. Refund Policy No refunds after purchase. Since this is a digital product, all sales are final. If you face any issues, feel free to reach out and I'll help you resolve them.

Drag. Spin. Cinematic 3D Cards