Cephalopod

Calendar

A date picker component that allows users to select a date.

Example

January 2026

Code

Example
import { Calendar } from "cephalopod-design-system"

const [date, setDate] = React.useState<Date | undefined>(new Date())

<Calendar
  mode="single"
  selected={date}
  onSelect={setDate}
  className="rounded-md border"
/>