Design System

Text Area

Rows

rows sets the initial visible height. The field resizes vertically from there by default. FieldLabel, FieldMessage, validation tones, and disabled state work the same as TextField; see the Field page for those.

<Stack space="large">
    <TextArea
        id="ta-a"
        label="Comment"
        placeholder="Write a short reply..."
        rows={3}
    />
    <TextArea
        id="ta-b"
        label="Description"
        secondaryLabel="Optional"
        rows={6}
    />
</Stack>