CleenUI · Forms · TextArea

TextArea

Multi-line text input with auto-resize, character count, and the same validation surface as Input.

storybook.cleenui.com · forms-textarea--controlled
Open in new window

About TextArea

TextArea handles any free-form multi-line text capture. Auto-resize grows the field as the user types up to a configurable maximum, then scrolls — so short inputs stay compact and long inputs stay readable.

A character-count indicator can be enabled to show progress against `maxLength`, with red-zone styling as the user approaches the limit. Validation, sizing, and error-state handling match the Input component so multi-line fields fit naturally into existing forms.

When to use it

  • Description and notes fields in detail forms.
  • Comment and reply composers.
  • Long-form context capture in onboarding and intake forms.
  • Code or markup entry with monospace styling.

Common props

Prop
Type
Description
rows
number
Initial visible row count.
autoResize
boolean
Grow with content up to maxRows.
maxLength
number
Character cap; enables the counter when set.
showCount
boolean
Display the character-count indicator.
error
string
Error message; flips into error styling when set.
Cross-references

Where this component shows up elsewhere in the foundation.

In modules

2
⚡ Already in an AI editor?

Set up CleenUI in your tool.

Skip the manual import — ask your AI agent to build with this component. The Builder skill knows its props, variants, and idioms.

Claude CodeCursorWindsurfGitHub CopilotClineAider+6All 12 guides
Other categories

More component families.

Live demo

See CleenUI running before you talk to us.

Configure a demo environment in about twenty seconds — theme, spacing, the modules you care about, sample data for your industry — then launch the full dashboard in your browser. Nothing to install, no signup.

  • 20 sec setup
  • 15 themes
  • 20 modules
  • 80 industries
Pick a theme to start with