Get everything for $99, lifetime

Components

Swipe Card Deck

Pro
Cherry blossoms in full bloom
Neon streets of Shibuya, Tokyo
Torii gates at Fushimi Inari, Kyoto
Mount Fuji
A steaming bowl of ramen
Dotonbori at night, Osaka
Hakone Lake in full bloom
Hakone Lake in full bloom
Swipe

Installation

ProRequires a Planes Pro license.
npx shadcn add @useplanes/swipe-card-deck

Works once the @useplanes registry is set up in your project (one-time). After that, copy and run commands directly.

Unlock with Planes Pro

$99 once · 161 Pro components · lifetime updates.

I have a licenseGet Pro
import { SwipeCardDeck } from "@/components/ui/SwipeCardDeck";

<SwipeCardDeck
  items={[
    { src: "/images/artwork-1.jpg", alt: "Working Knowledge" },
    { src: "/images/artwork-2.jpg", alt: "Practical Demonstration" },
    { src: "/images/artwork-3.jpg", alt: "Field Notes" },
  ]}
  hint="Swipe"
/>

Use cases

  • Mobile-first browsing

    Tinder-style swiping through cards, profiles, or products on touch devices.

  • Onboarding decks

    Step users through a stack of intro cards one swipe at a time.

  • Content shuffles

    Cycle featured items where dismissed cards loop to the back of the deck.

  • Responsive fallback

    Drop-in mobile presentation for fanned or grid layouts that don't fit small screens.