Textarea

The Textarea component allows you to easily create multi-line text inputs.

    SourceTheme Source@chakra-ui/textarea

Props#

The Textarea composes the Input component.

colorScheme

Description

The visual color appearance of the component

Type
"whiteAlpha" | "blackAlpha" | "gray" | "red" | "orange" | "yellow" | "green" | "teal" | "blue" | "cyan" | "purple" | "pink"

errorBorderColor

Description

The border color when the textarea is invalid. Use color keys in `theme.colors`

Type
string

focusBorderColor

Description

The border color when the textarea is focused. Use color keys in `theme.colors`

Type
string

isDisabled

Description

If true, the form control will be disabled. This has 2 side effects: - The FormLabel will have `data-disabled` attribute - The form element (e.g, Input) will be disabled

Type
boolean
Default
false

isInvalid

Description

If true, the form control will be invalid. This has 2 side effects: - The FormLabel and FormErrorIcon will have `data-invalid` set to true - The form element (e.g, Input) will have `aria-invalid` set to true

Type
boolean
Default
false

isReadOnly

Description

If true, the form control will be readonly

Type
boolean
Default
false

isRequired

Description

If true, the form control will be required. This has 2 side effects: - The FormLabel will show a required indicator - The form element (e.g, Input) will have `aria-required` set to true

Type
boolean
Default
false

size

Description

The size of the Textarea

Type
"xs" | "sm" | "md" | "lg"
Default
md

variant

Description

The variant of the Textarea

Type
"outline" | "flushed" | "filled" | "unstyled"
Default
outline
Edit this page on GitHub

Proudly made inNigeria by Segun Adebayo

Deployed by â–² Vercel