Input overview
Input fields allow users to enter and submit data. Choose the type that matches the shape and structure of what the user needs to provide.
Input fields allow users to enter and submit data. Choose the type that matches the shape and structure of what the user needs to provide.
Checkboxes allow the user to select multiple options from a list or a single yes/no option. Learn more about using checkbox.
The combobox combines a text field with a popover menu, allowing users to filter and choose an option from a list or enter their own value. Learn more about using combobox.
Date picker fields allow users to open a calendar and select a single date or a date range. Learn more about using date field.
Dropdown fields allow for selection of a value within a predetermined dataset. Learn more about using dropdown.
A numeric stepper is a control for editing a numeric value with buttons to decrease or increase the value. Learn more about using numeric stepper.
The password field lets users enter a password with characters concealed and a toggle to reveal them. Learn more about using password.
The phone number field is a specialized text field enabling quick phone number entry. Learn more about using phone number.
Radio buttons allow the user to select one option from a set. Learn more about using radio button.
Select list allows users to choose a single option from a predefined list. It uses the browser's native dropdown and is available on web only. Learn more about select list.
Switches allow users to toggle a setting on or off. Learn more about using switch.
Text areas allow for input that extends across multiple lines. Learn more about using text area.
Text fields let users enter and submit text. Learn more about using text field.
Use a checkbox when:
Yes — checkbox. No — radio button.
Use a radio button when:
Use a text field when:
Use a text area when:
Use a dropdown when:
Use a radio button when:
Every input should collect only the information needed for the task. Avoid asking for data you won’t use.
Use labels, helper text, and the right input type to set expectations before the user acts. Validation should confirm success as much as it flags failure.
Maintain the same field size, label position, and spacing throughout a form. Mixed patterns create uncertainty and slow users down.