3D Animated Carousel

Recorded preview. Sign in with eligible access to unlock the interactive preview.

About

Add a cinematic 3D image carousel to your Framer project, with a built-in intro animation that makes an instant first impression.

This component drops a rotating 3D carousel into any Framer page with zero code. What sets it apart is the intro animation: cards fly in from a spread position and settle into the carousel ring on load, giving your site that high-end, motion-first feel right from the first second.

Connect your images, adjust the controls, and you're done.

Customizable options

Images: Connect up to any number of images directly in Framer
Item Count: Control how many cards appear in the carousel ring
On Canvas: Pause or play the animation while editing in Framer canvas
Intro Animation: Toggle the cinematic fly-in entrance on or off
Intro Delay: Set how long after page load the intro animation triggers
Intro Duration: Control how long the entrance animation takes to complete
Start Speed & End Speed: Define how fast the carousel moves at the beginning and end of the intro
Start Gap & End Gap: Set how spread out the cards are at the start versus their final resting position
Auto Rotate: Toggle continuous rotation on or off
Direction: Choose Left or Right rotation direction
Distance: Adjust the 3D depth radius of the carousel ring
Corner Radius: Round the corners of each card
Image Width & Height: Set the exact size of each card in the carousel

Designed for Framer designers who want motion-forward layouts without writing a single line of code. Perfect for hero sections, portfolio showcases, product highlights, and anywhere you want the visuals to do the talking.

Used in template

More components

See All