Date picker.
Chooses a calendar date without requiring manual formatting.
See it in context
What it is
A date picker may open a calendar, display wheels, or use a native browser interface. It should communicate the chosen date clearly in the surrounding form.
When to use it
Make the selected date unambiguous and support manual entry when appropriate to the platform.
Know the difference
A time picker selects a time of day; a date picker selects a day on the calendar.
Across platforms
Web
Native input and select controls use browser-provided picker UI; the exact presentation differs across browsers and devices.
iOS · iPadOS
Pickers can appear inline, as wheels, or inside a compact presentation. Choose a style that fits the amount of space and the value being selected.
Android
Use the Android or Material selector appropriate to the value. Calendar and time selection commonly have dedicated dialog presentations.
Go to the source
Primary documentation for the pattern and its platform conventions.