# Swipe Stack

> Draggable card stack with spring physics — swipe cards left or right to dismiss them. Cards fan out in a stacked formation with depth scaling. Drag triggers rotation proportional to horizontal offset. Flick detection uses velocity threshold for snappy gestures. Swipe indicators fade in as you drag. Callbacks fire on each swipe with direction and index. Configurable stack depth, scale step, rotation factor, swipe threshold, and custom indicators. Fully responsive DOM-based rendering. Built on Framer Motion springs.

- Author: [Yad Hakim](https://21st.dev/@dev.yadhakim)
- License: unknown
- npm dependencies: framer-motion
- Live preview: https://21st.dev/@dev.yadhakim/components/swipe-stack

## Install

```bash
npx shadcn@latest add "https://21st.dev/r/dev.yadhakim/swipe-stack?api_key=$API_KEY_21ST"
```

Requires a 21st API key (generate one at https://21st.dev/mcp) passed as `API_KEY_21ST`. Free accounts get a limited number of installs per day; unlimited on a paid plan — see https://21st.dev/pricing.

Full component directory: https://21st.dev/llms.txt