React · npmReact Modern Datetime Picker
react-modern-datetime-picker is a powerful, highly customizable calendar and datetime picker component for React applications. Designed with a modern material UI, it supports multiple picker variants from simple date selection to full datetime picking with time controls, date ranges, and multi-date selection all in a single, lightweight package.
Whether you’re building a booking system, a scheduling dashboard, or a data-entry form, react-modern-datetime-picker gives you complete control over appearance, behavior, and accessibility.
344
Downloads
—
Likes
—
Points
MIT
License
MIT License
Free & open source forever
TypeScript
Full type definitions included
Universal
Works in any JS environment
Community
Actively maintained
Features
Key Points
Everything this package offers out of the box.
4 Picker Variants
Default, Time, Range, Multi-select
Full Theme Control
Customize every color primary, background, text, borders, hover
Custom Icons
Inject any React node as the input icon, left or right
Internationalization
Locale support, custom date formats, configurable week start
Date Constraints
Min/max dates, disabled dates, disabled days of week
Time Picker
12 / 24 hour format, minute intervals, optional seconds
Keyboard Navigation
Full accessibility with ARIA support
Zero Dependencies
Only peer deps: react and react-dom
TypeScript First
Complete type definitions included
Responsive
Mobile-aware modal positioning
About
What is React Modern Datetime Picker?
react-modern-datetime-picker is a powerful, highly customizable calendar and datetime picker component for React applications. Designed with a modern material UI, it supports multiple picker variants from simple date selection to full datetime picking with time controls, date ranges, and multi-date selection all in a single, lightweight package.
Whether you’re building a booking system, a scheduling dashboard, or a data-entry form, react-modern-datetime-picker gives you complete control over appearance, behavior, and accessibility.
- 4 Picker Variants : Default, Time, Range, Multi-select
- Full Theme Control : Customize every color primary, background, text, borders, hover
- Custom Icons : Inject any React node as the input icon, left or right
- Internationalization : Locale support, custom date formats, configurable week start
- Date Constraints : Min/max dates, disabled dates, disabled days of week
- Time Picker : 12 / 24 hour format, minute intervals, optional seconds
- Keyboard Navigation : Full accessibility with ARIA support
- Zero Dependencies : Only peer deps:
reactandreact-dom - TypeScript First : Complete type definitions included
- Responsive : Mobile-aware modal positioning
Package Stats
Quick Install
npm install react-modern-datetime-pickerNeed Custom Integration?
Our team can help you integrate and customize this package for your project.
Get a Free QuoteGet Started in Seconds
Install using your preferred JavaScript package manager.
npm install react-modern-datetime-pickeryarn add react-modern-datetime-pickerpnpm add react-modern-datetime-pickerNext step
Import the package and start building — full TypeScript types included.
Ready to build something great?
Integrate React Modern Datetime Picker into your project today and join thousands of developers who trust CodeX Lancers packages.