Skip to content

component

Flip Card Carousel

By Can Çevik

Details

Summary

3D Flip Card Carousel A carousel that turns instead of slides.

Description

3D Flip Card Carousel A carousel that turns instead of slides. Drag the deck and every cardrotates a half turn in real 3D: the centred card turns its face awaywhile the next one unfolds toward you. At the midpoint the whole deckstands edge-on, razor thin, before the incoming card opens up. Thecards to either side rest face-down, so the deck reads as a spread ofreal cards rather than a row of images. Built for editorial galleries, artist and release pages, productline-ups, tarot and oracle decks, portfolio showcases,and anywhere aplain slider feels too flat. ── HOW IT MOVES ── • Drag, swipe, arrows or keyboard — every input drives the same motion. • Spring physics with flick support: a quick throw carries the deck anextra card, a slow drag settles gently into place. • Each card carries a fixed, slightly different tilt, so the deck lookshand-dealt instead of machine-aligned. • The deck swings with its own momentum while it travels and easeslevel as it settles. • Optional infinite loop. ── PER-CARD CONTENT ── Every card takes its own Title, Front image, Back image and Link. Set aDefault Back once for the whole deck and override it only on the cardsthat need a different one. Links open in the same tab or a new one, andonly the centred card is clickable — a link under a half-hidden card isnever triggered by accident. Swiping never fires a link, so dragging ontouch stays safe.

Introduction

A carousel that turns, not slides

Rank history

Daily rank per list, from the first snapshot — lower is better.

110012001300137318/148/228/309/79/15
  • All · #3691