Text Field

Use GdsTextField for single-line or multi-line text input - names, emails, search, notes, and more.

Give every field a label. Use helperText for guidance, and pair it with error when validation fails. Colors for standard, filled, and outlined come from GDS theme tokens.

Default

A basic field with a label, placeholder, and helperText.

Variants

Use variant to choose outlined, filled, or standard.

Sizes

Use size for small or medium fields.

States

Show required, disabled, and error states.

Helper text

Use helperText for guidance, and pair it with error for validation.

Multiline

Pass multiline with minRows and maxRows for a textarea.

Select

For a dedicated select field, prefer GdsSelect with GdsFormControl, GdsInputLabel, and GdsMenuItem. You can also pass select on GdsTextField for a one-component API:

Adornments

Use GdsInputAdornment with slotProps.input for icons, units, or actions.

Props