---
title: "Infinite3DCarousel — Framer component · Best of Framer"
description: "$8.00 · Framer component · by Muhammad Hassan · Carousels. A high-performance, 3D carousel"
canonical: "https://framer.elliotli.dev/component/infinite3dcarousel"
---

[Home](/)/[Components](/components)/[Carousels](/components/category/carousels)/Infinite3DCarousel

# Infinite3DCarousel

A high-performance, 3D carousel

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

![Infinite3DCarousel preview image 1](https://framer.elliotli.dev/og/component/infinite3dcarousel/0803c6c05ffa8cd0/1600x1200.jpg)

## Summary

A high-performance, 3D carousel

## Description

Elevate your Framer site with a cinematic **3D Infinite Stack Carousel**. Unlike standard sliders, this component uses true 3D perspective and spring physics to create a tactile "fanning" effect. Whether you are showcasing a portfolio, product features, or team members, this carousel adds a layer of depth and interaction that feels premium and responsive.

### Features

-   **Infinite Looping:** Seamlessly cycle through your items without ever hitting a "dead end."
    
-   **Immersive 3D Depth:** Utilizes Z-axis transformation and fanned rotation for a realistic physical feel.
    
-   **Interactive Hover Reveals:** Content (Headings and Descriptions) stays hidden to maintain a clean aesthetic, revealing itself with a smooth slide-up animation on hover.
    
-   **Physics-Based Drag:** Fully draggable with customizable spring stiffness and damping for that "perfect" weight.
    
-   **Theming Options:** Choose from 5 built-in styles: **Standard**, **Glassy** (Frosted), **Neon** (Glow), **Metallic**, and **Fire**.
    
-   **Auto-Play:** Optional automatic cycling with adjustable intervals.
    

### What Makes It Unique?

-   **Center-Locked Drag:** We’ve engineered the drag logic so the cards never "fly away" from the frame. They remain perfectly centered while your gesture rotates the stack, ensuring your layout stays intact.
    
-   **Exposed Customization:** Almost every internal variable is exposed. You don't need to touch a single line of code to change the fanning angle, the stack depth, or the background card transparency.
    

### How to Use

1.  **Copy & Paste** the code into a new Framer code component.
    
2.  **Add Content:** Use the "Items" array in the property panel to upload your images and add your text.
    
3.  **Adjust Layout:** Set your desired width and height to match your site design.
    
4.  **Fine-tune the "Feel":** Adjust the "Fan Angle" and "Z-Radius" to find the perfect 3D balance for your brand.
    

## Property Panel Reference

**PropertyDescriptionVisible Depth**Controls how many cards are visible in the background stack.

**Theme**Switches between visual styles (Standard, Glassy, Neon, etc.).

**3D Perspective**Adjusts the "lens" of the 3D view (lower values = more extreme 3D).

**Spring Stiffness**Controls how "snappy" the movement is.

**Spring Damping**Controls how much the movement "bounces" before stopping.

**Z-Radius**Determines how far back the background cards sit in 3D space.

**Stack Spacing**Sets the horizontal (X-axis) distance between stacked cards.[](http://cards.Fan)

**Fan Angle**Sets the rotation degree of the side cards.

**Center Scale**The size multiplier of the active card in the front.

**Back Scale**How much smaller the cards get as they move to the background.

**Back Opacity**The transparency level of the background cards.

**Shadow Alpha**Adjusts the intensity of the card shadows or glows.

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

-   All · #9277

## Details

- **Author**: Muhammad Hassan
- **Price**: $8.00
- **Published**: 2026-05-13
- **Updated**: 2026-05-13
- **Added**: 2026-05-02
- **Categories**: Carousels

## More like this

-   [3DCurvedImageMarquee](/component/3dcurvedimagemarquee) — Lera · $4 — Curved perspective double ticker
-   [Orbit Kit Carousel](/component/orbit-kit-carousel) — Khairul Fauzy Khairudin · $12 — 3D drag carousel with inertia
-   [Team Orbit](/component/team-orbit) — Ali Musa · Free — Interactive Team Showcase
-   [Glow Testimonial](/component/glow-testimonial) — Interface Studio · Free — Testimonials with a Little Glow