01 / Playground
Build a picker
Change the controls, apply the setup, and interact with the resulting input picker.
Waiting for interaction.
02 / Calendar modes
Select one, several, or a span
Each calendar below starts with a different selection state.
Two-month range
Choose a start and end date across consecutive months.
Range ready
Multiple dates
Add or remove any number of individual dates.
Three dates selected
Restricted calendar
Weekends, boundaries, and specific dates are unavailable.
30-day window active
03 / Date and time
Calendar and clock combinations
Use a combined horizontal panel or isolate the clock for time-only input.
12-hour appointment
A horizontal date-and-time picker with an AM/PM control.
Adjust the date or time
24-hour clock
Direct hour and minute entry with wraparound controls.
00:00
Birthday
Step through day, month, and year without calendar navigation.
01/01/2000