Also called: dates, dateinput, date, memorable date.A date input is a space to enter a known date.
GitHub
Figma
Date input component preview
Problems date inputs solves
Take a look at what date inputs do to see if they fit the problem you’re solving for. Then select the best date input type for the use case you need to meet. Use a date input to gather a date from a person when you’re expecting them to write:
A date they already know, like their date of birth.
A date they can easily find, like a health card expiry date.
A specific date, like the date they moved to a new home.
A date that doesn’t include the specific day of the week.
Avoid using a date input for the selection of an unknown date. Use a date picker instead.
Related components
Input when you want someone to input only a year or only a day of the month. Select when you want someone to input only a month. Date picker when you want someone to choose a not-yet-known date, like for appointment scheduling.
Component formats
Month, day, year (English only)
A specific date the person will know or can easily find.
Used in English for written dates.
Day, month, year (French only)
A specific date the person will know or can easily find.
Used in French for written dates.
Year, month, day
A specific date the person will know or can easily find.
Used internationally for numeric dates.
Month, year
For an approximate date.
Help us improve Have questions or a request? Give feedback on our contact form. Something's wrong? Raise it through GitHub with an account. You'll have access to the team's direct responses, progress made on your issue, and issues raised by others. Give feedback Report an issue on GitHub 2026-05-25