Command Palette

Search for a command to run...

Calendar

A date picker calendar component built on react-day-picker with shincn styling.

March 2026

Installation

npx shadcn add calendar --registry https://ui.ch.sh/r

Usage

import { Calendar } from "@/components/ui/calendar"

export default function Example() {
  const [date, setDate] = React.useState<Date | undefined>(new Date())

  return (
    <Calendar
      mode="single"
      selected={date}
      onSelect={setDate}
    />
  )
}