# Stacked Cards Upload

> The Stacked Cards Upload component is a modern, interactive file upload interface built with Shadcn UI and Lucide icons. Each uploaded file or folder appears as a card in a stacked layout, animating smoothly into position as new files are added. Upload progress is visually represented as a subtle filling background inside the card, designed to adapt seamlessly to both light and dark themes. The file name and remove icon are vertically centered for a clean, consistent look, and users can remove any file with a single click on the trash icon. Fully configurable with callbacks like onRemove, this component provides a user-friendly, visually appealing way to manage multiple uploads in modern web applications.

- Author: [Ruixen UI](https://21st.dev/@ruixen.ui)
- Library: [Ruixen UI](https://21st.dev/@ruixen.ui/library/ruixen-ui)
- License: unknown
- npm dependencies: lucide-react, framer-motion
- Live preview: https://21st.dev/@ruixen.ui/components/stacked-cards-upload

## Install

```bash
npx shadcn@latest add "https://21st.dev/r/ruixen.ui/stacked-cards-upload?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