Angular Material

Form field appearance variants

Legacy form field

Hint

Standard form field

Hint

Fill form field

Hint

Outline form field

Hint

Form field with custom telephone number input control.

––

Phone number

Include area code

Form field with error messages

Enter your email

Testing with MatFormFieldHarness

This example contains tests. Open in Stackblitz to run the tests.

Form field with hints

Enter some input

Max 10 characters

0/10

Select me

Here's the dropdown arrow ^

Form field with label

Simple form field

Input

Select

Textarea

Form field with prefix & suffix

Enter your password

Amount

.00

Form field theming