Textarea Component
Displays a multi-line text input field that follows the shadcn/ui design system.
Default
A simple textarea with placeholder and automatic content sizing.
Disabled
Textarea with disabled state.
Required
Textarea with HTML5 required validation.
With Label
Textarea with labels and helper text.
Your bio will be displayed on your public profile.
Share your thoughts with the community.
Character Limit
Textarea with maximum character limit using MaxLength parameter.
0 / 280 characters
Accessibility (ARIA)
Textarea with ARIA attributes for screen readers.
Please provide as much detail as possible.
Please correct the error. Note the destructive border and ring applied via aria-invalid.
Two-Way Binding
Demonstrating real-time value updates using Value and ValueChanged.
Updates on every keystroke using Value and ValueChanged parameters.
Current value:
(empty)
Character count: 0
Custom Styling
Override styles with the Class parameter.
API Reference
Value
Type: string?
The current value of the textarea. Supports two-way binding with @bind-Value.
Placeholder
Type: string?
Placeholder text shown when textarea is empty.
MaxLength
Type: int?
Maximum number of characters allowed. Browser will prevent exceeding this limit.
Disabled
Type: bool
Whether the textarea is disabled. Default: false
Required
Type: bool
Whether the textarea is required for form validation. Default: false
ARIA Attributes
AriaLabel,
AriaDescribedBy,
AriaInvalid for accessibility.
Class
Type: string?
Additional CSS classes to apply. Custom classes override default styles.