Skip to content

Textarea Field

Textarea allows users to provide multiple lines of text.

Overview

Textareas allow for multiple lines of text and function very similarly to Text Fields with the addition of the rows property, which determines how tall the input will be.

Usage

Content

Textarea is not resizeable by default. Make the height of the textarea proportional to the amount of text expected and provide a scroll if the input exceeds the set height.

Variations

Custom row amount

Set a custom amount of rows to show if the default is not right for the content users are expected to enter.

Resizable

In some cases it can be useful to set the textarea to be resizable if it is not clear how much text will be entered.

Properties

NameValuesDefault

id (required)

String

label (required)

String

optional

Boolean

false

hint

ReactNode

error

ReactNode

characters

Number

25

fullWidth

alwaysneversmall

small

rows

Number

3

resizable

Boolean

false

...

JSX.IntrinsicElements["textarea"]

Tokens