Calendar

An inline month-view date picker grid with previous/next navigation, a highlighted today marker, and a filled selected day, for choosing or clearing a single date.

Built with React and Tailwind. Copy the prompt and paste it into Claude Code, Cursor or Lovable: your agent adds Calendar to your project and fits it to your theme.

"use client";

import Calendar from "@/components/ui/calendar";
import { useState } from "react";

export default function CalendarDemo() {
  const [date, setDate] = useState(new Date());
  return <Calendar value={date} onChange={setDate} />;
}