---
title: "3D Coverflow — Framer component · Best of Framer"
description: "$3.00 · Framer component · by Gazi Efe · Carousels. 3D Coverflow is a true cylindrical carousel: your slides ride the surface of a turning cylinder, each one tangent to the ring and facing…"
canonical: "https://framer.elliotli.dev/component/3d-coverflow"
---

[Home](/)/[Components](/components)/[Carousels](/components/category/carousels)/3D Coverflow

# 3D Coverflow

3D cylindrical image carousel

[View on Framer](https://framer.com/marketplace/components/3d-coverflow/?via=elliot-li)

![3D Coverflow preview image 1](https://framer.elliotli.dev/og/component/3d-coverflow/16fb509c3122e741/1600x1200.jpg)

## Summary

3D Coverflow is a true cylindrical carousel: your slides ride the surface of a turning cylinder, each one tangent to the ring and facing outward, so the left card turns left and…

## Description

3D Coverflow is a true cylindrical carousel: your slides ride the surface of a turning cylinder, each one tangent to the ring and facing outward, so the left card turns left and the right card turns right — like cards on the outside of a spinning wheel, not flat images sliding past.

NAVIGATION

\- Press and drag to spin the ring freely either way, following your pointer

\- Flick and release to keep spinning with momentum, easing to a stop and snapping to the nearest slide

\- Arrows, dots and arrow keys all glide smoothly

\- Smart tap vs drag: a quick tap on the front card opens its link; dragging never triggers it by accident

LINKS & BUTTONS

\- Give each slide an image link (tap the front card to open it)

\- Or add an optional call-to-action button per slide, with its own text and link

\- The button opens its own link, or falls back to the slide link

3D & LAYOUT

\- Full Circle mode spreads slides evenly around the ring so there's always depth behind the centre

\- Ring radius, perspective, side scale, opacity and back opacity all adjustable

\- Custom card width, height and corner radius

STYLE

\- Five arrow icon styles (chevron, arrow, caret, angle, triangle) with custom shape, size and colours

\- Custom dots, container radius, border and padding

\- Background and optional shading

RESPONSIVE

\- The whole scene scales down proportionally to fit phones and small sections, keeping the 3D proportions intact — set your design width and it just fits.

Built with clean code — no dependencies, no WebGL, images preloaded so navigation never stutters. Every property is editable directly in Framer.

## Rank history [How rankings work →](/terms#rankings)

-   All · #10287

## Details

- **Author**: Gazi Efe
- **Price**: $3.00
- **Published**: 2026-06-17
- **Updated**: 2026-06-26
- **Added**: 2026-06-17
- **Categories**: Carousels

## More like this

-   [Screen Stage Mockup](/component/screen-stage-mockup) — Aisol Studio · $14 — Your screens in synced devices
-   [Team Reel](/component/team-reel) — Ali Musa · Free — Interactive Team Showcase
-   [Slider](/component/slider) — MAS · Free — A smooth, customizable slider.
-   [Cascade Card Slider](/component/cascade-card-slider) — Tim Yeng · Free — Cards that cascade into view