← Components

Textarea

Collect multi-line text.

States

defaulthoverfocusdisabledinvalid

Tokens

background{semantic.surface.primary}
foreground{semantic.text.primary}
border{semantic.border.default}
radius{radius.md}
padding{space.3}
focusRing{semantic.focus.ring}

Accessibility

{
  "ruleIds": [
    "STYLE-A11Y-001"
  ],
  "focusVisible": true,
  "keyboard": "Standard textarea behavior.",
  "labelRequired": true
}

Do / Don't

Do

  • Provide a visible label.

Don't

  • Do not use for single short values.