Date Input

Date Input is used to capture a specific calendar date from the user, such as a birthdate, appointment, or deadline. It ensures standardized formatting and accurate date selection, often through a text field, calendar picker, or a combination of both, enhancing usability and reducing input errors.

Styles

default
Enter date in DD/MM/YYYY format
warning
Please enter a valid date
destructive
Invalid date format
success
Valid date

Variations

Medium
default
Enter date in DD/MM/YYYY format
default
Enter date in DD/MM/YYYY format

States

default:default
default:hover
default: focus-populated
default: filed
default: disabled
destructive:default
destructive:hover
destructive: focus-populated
destructive: filed
destructive: disabled
With helper text
Invalid date format