Although we have only one type of text input to be used, there are different roles that they can function in that ensure that these inputs prove sufficient for multiple use cases.

Function

Default

Default text inputs are used for most of the input needs across an interface. From filling up forms to entering text content in provided form fields to complete an action or a task. this text input is mostly utilized. Icons are not seldom required in this text input, however, they can included when extremely necessary.

Multiline

Multiline text input functions for input that requires more than one line of text. This text input adjusts vertically based on the amount of lines of text entered into the text field.

Labelling

A couple of elements come together to support the input field depending on the context in is being used. These elements either provide added information or provide much needed support to ensure users are able to complete intended tasks.

Label

The label is an optional feature that can accompany the text input. It an be used to point out what is required in the input field.

Required

This type of label that is usually applied in forms to inform users of a compulsary information that is to be provided in order to complete the form. It is represented by an asterisk mark (*) that appears after the label text.

Helper text

Helper text appears at the bottom of the input field and it is primarily to serve as an alert for the user to inform them based on the input they have entered but only where necessary.