Date range picker.
Selects the start and end of a calendar interval.
See it in context
What it is
A range picker treats two dates as one connected choice, often highlighting the days between them. A clear start/end relationship prevents accidentally reversed intervals.
When to use it
Label both endpoints and keep the end date on or after the start date.
Know the difference
Two unrelated date fields are independent values; a date range is one bounded interval.
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.