ui
XGitHub

Textarea

A component that allows users to input long text.

textarea-demo.tsx
import { Textarea } from "@/components/ui/textarea"
 
export function TextareaDemo() {
	return <Textarea className="w-80" placeholder="Enter your message..." />
}

Installation

npx shadcn@latest add https://9ui.dev/r/textarea.json

Usage

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

Examples

Disabled

textarea-disabled.tsx
import { Textarea } from "@/components/ui/textarea"
 
export function TextareaDisabled() {
	return (
		<Textarea className="w-80" placeholder="Enter your message..." disabled />
	)
}

Error

textarea-error.tsx
import { Textarea } from "@/components/ui/textarea"
 
export function TextareaError() {
	return (
		<Textarea
			className="w-80"
			placeholder="Enter your message..."
			aria-invalid
		/>
	)
}