Password Text fields allow users to input and edit passwords.

Password Text fields typically reside in forms but can appear in other places, like dialog boxes and search.


Password Text fields should have the following characteristics:


Using a tappable touch target, password text fields should indicate that users can enter information.


It should be easy to find a password text field among other elements.


Password Text fields should indicate their state – whether enabled or disabled, empty or filled, valid or invalid – with clear label, input, and assistive text.


Password Text fields contain the following elements:


Password Text field labels display the type of input a field requires. Every text field should have a label.
Labels are aligned with the input line and always visible. They can be resting (when a field is inactive and empty) or floating.

Password Input line

The input line indicates where to enter text, displayed below the label.
When a field is active or contains an error, the line’s color and thickness vary.


The cursor indicates the user’s current input position.

Password text box


Text field states in light and dark themes.