Shadcn.io is not affiliated with official shadcn/ui
Calendar as Appointment Picker
A basic single-date calendar for simple date selection without range or dropdown features
Sometimes you just need users to pick one date. This React calendar keeps it simple—click a date, that's it. Built with shadcn/ui and react-day-picker in single mode, it provides the core calendar functionality without the complexity of ranges or dropdowns. Perfect for appointment booking, event registration, or any form needing a single date input.
Calendar as Appointment Picker preview
Installation
Related Components
Range Calendar
Date range selection with dual months
Month/Year Dropdown
Calendar with quick month/year navigation
Date Picker Input
Compact input with calendar popover
Calendar with Today Button
Single date calendar with quick actions
Calendar in Dialog
Calendar within modal dialog
Multiple Date Selection
Select multiple individual dates
FAQ
Was this page helpful?
Sign in to leave feedback.