Mini Month Grid

Month header above a 7-column grid of day numbers. Today pops with foreground, highlights tint sky.

April2026

123456789101112131415161718192021222324252627282930

Requires shadcn/ui initialized. Run npx shadcn@latest init if you haven't.

Import & use

import { Calendar2 } from "@/components/beste/piece/calendar2";

<Calendar2
  month="April"
  year={2026}
  startWeekday={2}
  daysInMonth={30}
  today={21}
  highlights={[
    7,
    14,
    28
  ]}
  weekdays={[
    "M",
    "T",
    "W",
    "T",
    "F",
    "S",
    "S"
  ]}
/>