Components
Curated UI collection
shadcn Date Time Picker Components
The shadcn date time picker component collection includes 16 open-source options for React developers. These components provide date and time selection functionality built on shadcn's design system. Whether you need calendar-based pickers, time inputs, or combined date-time selectors, this collection covers various implementations. Browse the full range of date time picker components available in the shadcn ecosystem to find the right solution for your project.
Calendar Date Picker
by shadcn
Calendar date and time picker
by shadcn
Calendar language date picker
by shadcn
Calendar day picker
by shadcn
Calendar Date & Time range
by shadcn
Calendar picker in a drawer
by shadcn
Calendar with time picker inline
by shadcn
Calendar input
by shadcn
Calendar With Month and Year Dropdown
by shadcn
Calendar Date and Time range
by shadcn
Input
by Origin UI
Datetime Picker
by OpenStatus
Input
by Origin UI
Calendar with time piker
by shadcn
Input
by Origin UI
Scheduler
by Ruixen
Calendar with little-date
by shadcn
Datetime Picker
by Yerfa Belkacem
Select
by Origin UI
Calendar with presets
by shadcn
Calendar with time pressets
by shadcn
Calendar with event slots
by shadcn
Calendar Twin
by Ruixen
Calendar with week numbers
by shadcn
Input
by Origin UI
Day Picker
by 0xUrvish
Event Scheduler
by Ruixen![Calendar [React Day Picker] — shadcn date time picker component for React & Tailwind by Origin UI](https://cdn.21st.dev/user_originui/calendar/with-time-input/preview.png?v=1)
Calendar [React Day Picker]
by Origin UI
ChronoSelect
by Ruixen
Calendar with localisation
by shadcn
Calendar Variable size
by shadcn
Calendar with day button
by shadcn![Calendar [React Day Picker] — shadcn date time picker component for React & Tailwind by Origin UI](https://cdn.21st.dev/user_originui/calendar/default/preview.1737991401753.png)
Calendar [React Day Picker]
by Origin UI
Date Picker
by Kavi Katiyar
Dual Calendar
by shadcn
Range selection calendar
by shadcn
Input
by Origin UI
Dropdown Multi Calendar
by Ruixen
Calendar with disabled weekends
by shadcn![Calendar [React Day Picker] — shadcn date time picker component for React & Tailwind by Origin UI](https://cdn.21st.dev/user_originui/calendar/w/preview.png?v=1)
Calendar [React Day Picker]
by Origin UI
Side Panel Multi Calendar
by Ruixen
Event Calendar
by Ruixen
Universal Date Picker
by Ruixen
Select (Native)
by Origin UI
Wheel Of Time Calendar
by Ruixen
Calendar with disabled days
by shadcn
Input
by Origin UI
Calendar with start end month
by shadcn
Dropdown Range Date Picker
by Ruixen![Calendar [React Day Picker] — shadcn date time picker component for React & Tailwind by Origin UI](https://cdn.21st.dev/user_originui/calendar/default/preview.1737991576300.png)
Calendar [React Day Picker]
by Origin UI
Multi Select Calendar Card
by Ruixen
Calendar Scheduler
by Ruixen
Date Time Input
by Ruixen
Calendar
by coss
Date Wheel Picker
by johuniq
Date Picker
by Shailendra Kumar
Pill Calendar
by Ruixen
DateTimePicker
by Ruixen![Calendar [React Day Picker] — shadcn date time picker component for React & Tailwind by Origin UI](https://cdn.21st.dev/user_originui/calendar/default/preview.1737991444744.png)
Calendar [React Day Picker]
by Origin UI
Time Picker
by Ruixen
What’s in this collection
- 3 of 51 use Motion
- 3 of 51 use Radix
- 15 of 51 use Lucide icons
- 26 need nothing beyond React and Tailwind
- Most common dependencies: lucide-react, date-fns