Diagonal Card Slider

3D Draggable project stack

Live Preview Grab more free components Diagonal Drag Card Slider is an interactive project showcase that stacks cards along a diagonal and lets users drag through them in any direction. Cards glide naturally into place with spring-based motion, while the active project name reveals from the bottom-left. Autoplay can also move through the projects automatically. Features Diagonal 3D card stack Drag in any direction Smooth spring-based transitions Velocity-based inertia Automatic autoplay Active project name reveal Clickable project cards with custom links Adjustable card scaling, tilt, spacing, and rotation Responsive Framer property controls Fully Customizable Customize the entire stack directly from Framer's right-hand panel, including projects, card dimensions, spacing, 3D motion, spring physics, autoplay, dimming, typography, colors, and more. Customize Projects, images, names & links Card width, height & radius Horizontal & vertical spacing 3D tilt & rotation Scale falloff Spring stiffness, damping & mass Drag distance Autoplay & interval Dim color & amount Project name typography & color How It Works Drag the stack to move through your projects. Your gesture is projected onto the diagonal, and the cards smoothly settle into the next position using spring physics and your drag velocity. The centered card becomes interactive and displays its project name.

3D Draggable project stack