Stacked Tinder-Swipe Cards

Pro

Swipe and the card flies—the next rises before you let go.

Loading preview...

Props

PropTypeDefaultDescription
cardsSwipeCardItem[]-Cards in the swipe deck.
visibleCountnumber3Visible cards in the stack.
widthnumber320Width of each card in pixels.
heightnumber440Height of each card in pixels.
showActionsbooleantrueShow the action button row (Pass / Super-like / Like).
betweenActionsReact.ReactNode-Optional content rendered between the card stack and action controls.
loopbooleantrueRe-cycle swiped cards back onto the bottom of the deck.
onSwipe(id: string, direction: SwipeDirection) => void-Fired after a card is swiped away.