Textarea

Documentation Index

Fetch the complete documentation index at: /llms.txt. Use this file to discover all available pages before exploring further.

A native textarea element.

textarea-demo

Overview

Use Textarea for multi-line text.

Textareas are useful for comments, descriptions, notes, feedback, support messages, and any field where the answer may be longer than one line.

Anatomy

A textarea has a value, placeholder, size, disabled state, and optional validation state. It should usually be wrapped in Field.

Usage guidance

Use Input for short single-line values. Use Textarea when users need space to write. Set a sensible minimum height so the field does not feel cramped.

Accessibility

Always provide a label. Add helper text when users need to know expected length, format, or privacy context.

Installation

npx honestui@latest add textarea

Usage

import { Textarea } from "@/components/ui/textarea"
<Textarea />

Examples

Our examples cover sizes, disabled state, labels, and form integration.

For accessible labelling and validation, prefer using the Field component to wrap textareas. See the related example: Textarea field.

Small Size

textarea-sm

Large Size

textarea-lg

Disabled

textarea-disabled

With Label

textarea-with-label

Form Integration

textarea-form