Components
Curated UI collection
Base UI Date Picker Components
Base UI offers a collection of 52 date picker components designed for React developers who need flexible, unstyled date selection functionality. These components provide the foundational building blocks for implementing custom date pickers without opinionated styling constraints. Whether you're building simple date inputs or complex calendar interfaces, Base UI's date picker components deliver the core functionality needed for robust date selection experiences.
Date Wheel Picker
by Osiris Balonga
Date Picker
by Shailendra
Calendar
by coss
DatePicker
by Hero Ui
Day Picker
by 0xUrvish
Date Wheel Picker
by johuniq
Date picker
by shadcn![Calendar [React Day Picker] — base ui date picker component for React & Tailwind by Origin UI](https://cdn.21st.dev/user_originui/calendar/default/preview.1737991983843.png)
Calendar [React Day Picker]
by Origin UI![Date Range Picker [react-aria-components] — base ui date picker component for React & Tailwind by James Shopland](https://cdn.21st.dev/user_jolbol1/date-range-picker/default/preview.png)
Date Range Picker [react-aria-components]
by James Shopland
Input
by Origin UI
Universal Date Picker
by Ruixen UI![Calendar [React Day Picker] — base ui date 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
Apple Calendar Picker
by Muhammad Asif
Input
by Origin UI![Calendar [React Day Picker] — base ui date picker component for React & Tailwind by Origin UI](https://cdn.21st.dev/user_originui/calendar/appointment-picker/preview.png?v=1)
Calendar [React Day Picker]
by Origin UI
Datetime Picker
by OpenStatus
Datetime Picker
by Yerfa Belkacem
Dropdown Range Date Picker
by Ruixen UI![Calendar [React Day Picker] — base ui date 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![Date Picker [react-aria-components] — base ui date picker component for React & Tailwind by James Shopland](https://cdn.21st.dev/user_jolbol1/date-picker/1045/preview.png)
Date Picker [react-aria-components]
by James Shopland
Calendar
by coss![Calendar [React Day Picker] — base ui date 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
Calendar With Presets
by Ruixen UI
Mini Calendar
by Hardik Kubavat
Color Picker
by Trevor McIntire
Calendar Date Picker
by shadcn![Calendar [React Day Picker] — base ui date picker component for React & Tailwind by Origin UI](https://cdn.21st.dev/user_originui/calendar/range-calendar-with-presets/preview.png?v=1)
Calendar [React Day Picker]
by Origin UI
Emoji Picker
by liveblocks
Calendar input
by shadcn
Date Picker
by Kavi Katiyar![Calendar [React-Area] — base ui date picker component for React & Tailwind by Origin UI](https://cdn.21st.dev/user_originui/calendar-rac/default/preview.1737992099506.png)
Calendar [React-Area]
by Origin UI
DateRangePicker
by Hero Ui
Multi Month Calendar
by Ruixen UI
DateTimePicker
by Ruixen UI![Calendar [React Day Picker] — base ui date picker component for React & Tailwind by Origin UI](https://cdn.21st.dev/user_originui/calendar/default/preview.1737991942757.png)
Calendar [React Day Picker]
by Origin UI![Calendar [React-Area] — base ui date picker component for React & Tailwind by Origin UI](https://cdn.21st.dev/user_originui/calendar-rac/default/preview.1737992261935.png)
Calendar [React-Area]
by Origin UI![Calendar [React Day Picker] — base ui date picker component for React & Tailwind by Origin UI](https://cdn.21st.dev/user_originui/calendar/default/preview.1737991729807.png)
Calendar [React Day Picker]
by Origin UI
Calendar Scheduler
by Ruixen UI![Calendar [React Day Picker] — base ui date picker component for React & Tailwind by Origin UI](https://cdn.21st.dev/user_originui/calendar/two-months-calendar/preview.png?v=1)
Calendar [React Day Picker]
by Origin UI
Radial Time Picker
by Mathew
CalendarLume
by Ruixen UI
Calendar
by tigran tumasov
Dropdown Multi Calendar
by Ruixen UI
Side Panel Multi Calendar
by Ruixen UI
Event Scheduler
by Ruixen UI
Calendar
by coss
Calendar language date picker
by shadcn
Color Picker
by Trevor McIntire![Calendar [React Day Picker] — base ui date picker component for React & Tailwind by Origin UI](https://cdn.21st.dev/user_originui/calendar/pricing-calendar/preview.png?v=1)
Calendar [React Day Picker]
by Origin UI![Calendar [React Day Picker] — base ui date 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
Calendar picker in a drawer
by shadcn
DatePicker
by Hero Ui![Calendar [React Day Picker] — base ui date 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
Calender
by Preet Suthar![Date Field [react-aria-components] — base ui date picker component for React & Tailwind by James Shopland](https://cdn.21st.dev/user_jolbol1/datefield/1027/preview.png)
Date Field [react-aria-components]
by James Shopland
Input
by Origin UI
Calendar date and time picker
by shadcn![Calendar [React Day Picker] — base ui date picker component for React & Tailwind by Origin UI](https://cdn.21st.dev/user_originui/calendar/calendar-with-presets/preview.png?v=1)
Calendar [React Day Picker]
by Origin UI
Calendar
by tigran tumasov![Calendar [React Day Picker] — base ui date picker component for React & Tailwind by Origin UI](https://cdn.21st.dev/user_originui/calendar/default/preview.1737991510476.png)
Calendar [React Day Picker]
by Origin UI
What’s in this collection
- 7 of 39 use Motion
- 16 of 39 use Lucide icons
- 10 need nothing beyond React and Tailwind
- Most common dependencies: lucide-react, date-fns, motion