Components
Curated UI collection
React Aria Calendar Components
React Aria provides accessible calendar components built on WAI-ARIA standards for React applications. Browse 60 calendar-related components and libraries in the React Aria ecosystem, including 32 exact matches. These unstyled, headless calendar components give you full control over styling while maintaining accessibility compliance out of the box. Whether you need date pickers, month views, or range selectors, React Aria calendar components offer a solid foundation for building accessible date selection interfaces.
![Calendar [React-Area] — react aria calendar 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![Calendar [React-Area] — react aria calendar 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-Area] — react aria calendar component for React & Tailwind by Origin UI](https://cdn.21st.dev/user_originui/calendar-rac/default/preview.1737992048466.png)
Calendar [React-Area]
by Origin UI![Calendar [react-aria-components] — react aria calendar component for React & Tailwind by James Shopland](https://cdn.21st.dev/user_jolbol1/calendar/985/preview.png)
Calendar [react-aria-components]
by James Shopland![Range Calendar [react-aria-components] — react aria calendar component for React & Tailwind by James Shopland](https://cdn.21st.dev/user_jolbol1/range-calendar/default/preview.png)
Range Calendar [react-aria-components]
by James Shopland
Range Calendar
by Hero Ui
Range Calendar
by Hero Ui
Range Calendar
by Hero Ui
Range Calendar
by Hero Ui
Range Calendar
by Hero Ui
DatePicker
by Hero Ui
Range Calendar
by Hero Ui
Range Calendar
by Hero Ui
DatePicker
by Hero Ui
DateRangePicker
by Hero Ui
DatePicker
by Hero Ui![Date Range Picker [react-aria-components] — react aria calendar 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![Date Picker [react-aria-components] — react aria calendar 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
Range Calendar
by Hero Ui
Range Calendar
by Hero Ui
DatePicker
by Hero Ui
Input
by Origin UI
DatePicker
by Hero Ui![Calendar [React Day Picker] — react aria calendar 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 Day Picker] — react aria calendar 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
DatePicker
by Hero Ui![Calendar [React Day Picker] — react aria calendar component for React & Tailwind by Origin UI](https://cdn.21st.dev/user_originui/calendar/three-months-calendar/preview.png?v=1)
Calendar [React Day Picker]
by Origin UI![Calendar [React Day Picker] — react aria calendar component for React & Tailwind by Origin UI](https://cdn.21st.dev/user_originui/calendar/default/preview.1737991888250.png)
Calendar [React Day Picker]
by Origin UI![Calendar [React Day Picker] — react aria calendar component for React & Tailwind by Origin UI](https://cdn.21st.dev/user_originui/calendar/default/preview.1737991782118.png)
Calendar [React Day Picker]
by Origin UI
React Aria Emoji Picker
by devongovett![Calendar [React Day Picker] — react aria calendar 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![Calendar [React Day Picker] — react aria calendar 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
DatePicker
by Hero Ui![Date Field [react-aria-components] — react aria calendar 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
Pill Calendar
by Ruixen![Calendar [React Day Picker] — react aria calendar 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
Input
by Origin UI![Calendar [React Day Picker] — react aria calendar 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![Calendar [React Day Picker] — react aria calendar 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![Calendar [React Day Picker] — react aria calendar 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] — react aria calendar component for React & Tailwind by Origin UI](https://cdn.21st.dev/user_originui/calendar/default/preview.1737991629350.png)
Calendar [React Day Picker]
by Origin UI
Mini Calendar
by Hardik Kubavat![Calendar [React Day Picker] — react aria calendar 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![Calendar [React Day Picker] — react aria calendar component for React & Tailwind by Origin UI](https://cdn.21st.dev/user_originui/calendar/default/preview.1737991677442.png)
Calendar [React Day Picker]
by Origin UI![Calendar [React Day Picker] — react aria calendar 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
Apple Calendar Picker
by Muhammad Asif![Calendar [React Day Picker] — react aria calendar component for React & Tailwind by Origin UI](https://cdn.21st.dev/user_originui/calendar/weekly-numbers/preview.png?v=1)
Calendar [React Day Picker]
by Origin UI![Calendar [React Day Picker] — react aria calendar 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 [React Day Picker] — react aria calendar 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 [React Day Picker] — react aria calendar 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
DateRangePicker
by Hero Ui
Calendar
by SubframeApp
Calendar With Presets
by Ruixen![Calendar [React Day Picker] — react aria calendar 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
DateField
by Hero Ui
Calendar
by Abraham
Fullscreen Calendar
by Ahmed Mayara
Calendar
by Abraham
DateField
by Hero Ui
DateRangePicker
by Hero Ui
What’s in this collection
- 9 of 20 use Lucide icons
- 5 need nothing beyond React and Tailwind
- Most common dependencies: lucide-react, react-aria-components, @internationalized/date