Dev Design LibraryReact Date Picker Components
Dev Design Library indexes 103 React date picker components from 38 open-source UI libraries, with the most coming from Origin UI, Watermelon UI, React Spectrum, ReUI and HeroUI. Each one links to its page with the source code, a live preview where available, the library license and the install command. Every library in this list targets React. Date picker components belong to the Inputs group.
Date PickerChakra UI · ReactUsed to select dates or date ranges from a calendar.
Date FieldHeroUI · ReactDate input field with labels, descriptions, and validation built on React Aria DateField
Date PickerReact Spectrum · ReactDatePickers combine a DateField and a Calendar popover to allow users to enter or select a date and time value.
Comp 41Origin UI · React
Date InputArk UI · ReactA segment-based date input that allows users to enter dates by navigating individual date parts.
Date PickerTremor · React
Basic date selectorReUI · ReactBasic date selector
Date Position SelectorAmicro Micro Transitions · ReactThree consecutive day numbers (24th, 25th, 26th) with sliding highlight pill.
Date PickerPark UI · ReactAn input component for selecting dates with a calendar interface.
Date PickerLobe UI · ReactA DatePicker component that extends Ant Design's DatePicker with additional styling options. It provides different…
date-pickerIntent UI · Reactdate-picker
Date PickerUntitled UI React · React
Date Range PickerbeUI · ReactComposable date range picker with root, trigger, popover content, calendar, header, grid, summary, footer, clear and…
Date FieldTailGrids · ReactA React date field component that lets users input a date.
Datetime PickerSpectrum UI · ReactA date and time picker built on shadcn/ui with no extra dependencies.
Date PickerFluid Functionalism · ReactField or ghost trigger for a date, a range, or a date and a time: a calendar popover that opens on the selected day…
Date PickerPanel UI · React NativeA calendar behind a button.
Date Picker 02 - Date RangeShadcn Space · ReactA professional appointment booking card with date and time range selection.
Date Field InputOpenSourceUI · React
Day Pickeruselayouts · ReactA custom day picker component with smooth animations.
Date PickerBoardUI · ReactPopover calendar for single dates.
Date PickerTremor Blocks · React
date-fieldBaseLayer · ReactA date field allows users to enter and edit date and time values using a keyboard. Each part of a date value is…
Date PickerShark UI · ReactInput with a built-in calendar.
Schedule ChipSona UI · React
Alphine Booking FormWatermelon UI · React
Date Range PickerUI Lab · ReactPaints the range as you hover, then commits it on the second click.
Date pickerHextaUI · ReactA button that opens a calendar in a popover, or a bottom sheet on phones, for single dates and ranges.
Date PickerCojeev UI · ReactChoose one day, a range, or multiple dates from a labelled field and calendar popover.
Date PickerHalaska UI · React
Date SelectorSpaceUI · ReactAllows users to quickly choose single dates or time ranges using interactive timeline scrubbers and preset shortcut…
Payment ReminderZAYX · React Native
Date FieldOUI · ReactReact aria components DateField with shadcn characteristics.
Liquid Date PickerLiquefy UI · ReactDate picker with a calendar in liquid glass style.
Glass Date PickerOpaline · ReactGlass calendar with a gliding day bubble, and a capsule date picker.
Date PickerFibo · ReactA field that opens a calendar to pick a day, or a range with presets and Apply; a popover on desktop, a drawer on…
Date PickerReactFrame · ReactA date picker with a popover calendar: single date or range selection, month navigation, min/max and disabled dates…
Date Pickerark-cn · ReactA shadcn-style date picker component built with Ark UI primitives.
Date PickerHeroUI · ReactComposable date picker built on React Aria DatePicker with DateField and Calendar composition
Date Range PickerReact Spectrum · ReactDateRangePickers combine two DateFields and a RangeCalendar popover to allow users to enter or select a date and time…
Comp 42Origin UI · React
Date PickerArk UI · ReactA component that allows users to select a date from a calendar.
Date selector with popoverReUI · ReactDate selector with popover
date-range-pickerIntent UI · Reactdate-range-picker
Date PickerTailGrids · ReactA component to select a date.
Date PickerFluid Functionalism · ReactField or ghost trigger for a date, a range, or a date and a time: a calendar popover that opens on the selected day…
Week StripPanel UI · React NativeOne row of days to pick from, with marks for what is on each.
Date Picker 04 - Date of BirthShadcn Space · ReactBirthday picker with month and year dropdowns, future dates disabled, and a live age check with a minimum age message.
Date Range Picker CardOpenSourceUI · React
date-pickerBaseLayer · ReactA date picker combines one or more DateFields with a calendar popover, allowing users to enter or select a single…
Date Picker 1Watermelon UI · React
Date PickerOUI · ReactReact aria components DatePicker with shadcn characteristics.
Date Range PickerHeroUI · ReactComposable date range picker built on React Aria DateRangePicker with DateField and RangeCalendar composition
Tailwind Date PickerReact Spectrum · React
Comp 487Origin UI · React
Date selector with dialogReUI · ReactDate selector with dialog
Range CalendarTailGrids · ReactA calendar component for selecting a range of dates.
Date Picker 05 - Task Due DateShadcn Space · ReactTask due date picker with Today, Tomorrow, This weekend, and Next week shortcuts, overdue and due soon states, and a…
Date Picker 10Watermelon UI · React
Range CalendarHeroUI · ReactComposable date range picker with month grid, navigation, and year picker support built on React Aria RangeCalendar
Tailwind Date Range PickerReact Spectrum · React
Comp 488Origin UI · React
Date selector with dropdown menuReUI · ReactDate selector with dropdown menu
Date Picker 06 - Multiple DatesShadcn Space · ReactTime off picker for selecting multiple dates with weekends disabled, a day allowance limit, and removable date chips.
Date Picker 11Watermelon UI · React
Vanilla Date PickerReact Spectrum · React
Comp 489Origin UI · React
Date SelectorReUI · ReactA universal date selector component with multiple period types, filter modes, and flexible display options.
Date Picker 12Watermelon UI · React
Vanilla Date Range PickerReact Spectrum · React
Comp 490Origin UI · React
Date Picker 13Watermelon UI · React
Comp 491Origin UI · React
Date Picker 2Watermelon UI · React
Comp 492Origin UI · React
Date Picker 3Watermelon UI · React
Comp 493Origin UI · React
Date Picker 4Watermelon UI · React
Comp 494Origin UI · React
Date Picker 5Watermelon UI · React
Comp 495Origin UI · React
Date Picker 6Watermelon UI · React
Comp 496Origin UI · React
Date Picker 7Watermelon UI · React
Comp 497Origin UI · React
Date Picker 8Watermelon UI · React
Comp 498Origin UI · React
Date Picker 9Watermelon UI · React
Comp 499Origin UI · React
Comp 500Origin UI · React
Comp 501Origin UI · React
Comp 502Origin UI · React
Comp 503Origin UI · React
Comp 504Origin UI · React
Comp 505Origin UI · React
Comp 506Origin UI · React
Comp 507Origin UI · React
Comp 508Origin UI · React
Comp 509Origin UI · React
Comp 510Origin UI · React
Comp 511Origin UI · React
Comp 512Origin UI · React
Datefield RacOrigin UI · React
Libraries with React date picker components
Related categories
- Date Picker Components
- Tailwind CSS Date Picker Components
- Animated Date Picker Components
- shadcn/ui Date Picker Components
- React Input Components
- React Select Components
- React Text Input Components
- React Form Field Components
- React Form Components
- React Switch Components
- React Textarea Components
- React Checkbox Components
- React Slider Components
- React Radio Components
- React Combobox Components
- React File Upload Components
- React Search Input Components
- React Color Picker Components
- React Login Form Components
- React OTP Input Components