Shadcn.io is not affiliated with official shadcn/ui
Calendar with Month and Year Selector
A calendar with dropdown selectors for month and year navigation, enabling quick jumps to distant dates
Ever watch users click through months one by one to reach a birthdate 30 years ago? This React calendar adds shadcn/ui Select dropdowns for month and year, letting users jump directly to any date. Built with react-day-picker's captionLayout dropdown mode, it combines calendar navigation with dropdown convenience—perfect for birthdate pickers, historical data, or any interface needing quick date access across years.
Calendar with Month and Year Selector preview
Installation
Related Components
Range Calendar
Dual-month date range selection calendar
Single Date Calendar
Basic calendar without dropdown navigation
Date Picker Input
Input field with calendar popover
Basic Select
Dropdown select component
Calendar with Footer
Calendar with action buttons below
Date Picker with Presets
Input with quick date selection
FAQ
Was this page helpful?
Sign in to leave feedback.