# Cookie Banner

> CookieBanner is a lightweight, responsive cookie consent component for Next.js built with TypeScript and TailwindCSS v4. It displays a customizable message with Accept and Decline actions, remembers the user’s choice in localStorage, and supports light/dark themes. Smooth slide-and-fade animations are powered entirely by Tailwind’s tw-animate-css utilities, ensuring no extra animation libraries are needed.  This banner is fully accessible, adapts its layout across screen sizes, and can appear at the top or bottom of the viewport based on your preference — making it easy to integrate into any modern web app.

- Author: [Arunachalam](https://21st.dev/@arunachalam)
- License: unknown
- Live preview: https://21st.dev/@arunachalam/components/cookie-banner

## Install

```bash
npx shadcn@latest add "https://21st.dev/r/arunachalam/cookie-banner?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