# Event Calendar

> The Event Calendar component is a fully interactive calendar built with Shadcn UI components, allowing users to manage events efficiently. Users can select a date on the calendar to view all events scheduled for that day. Events are displayed as cards under the selected date, with the ability to add new events via an input field and button. Each event card includes a Lucide Trash2 icon, enabling users to remove events seamlessly. The component supports multiple events per date, is fully responsive, and works in both light and dark themes. It provides a clean, user-friendly interface for daily scheduling, planning, or tracking important tasks directly within a Shadcn UI-styled calendar.

- Author: [Ruixen UI](https://21st.dev/@ruixen.ui)
- Library: [Ruixen UI](https://21st.dev/@ruixen.ui/library/ruixen-ui)
- License: unknown
- npm dependencies: uuid, date-fns, lucide-react
- Live preview: https://21st.dev/@ruixen.ui/components/event-calendar

## Install

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