Skip to main content
Context GrammarContext-aware AI

Textarea and select

Multi-line text takes the body face because it holds prose. The select is the browser’s own, restyled, so it keeps native keyboard and touch behaviour.

Controls

▾

Code

import { Textarea } from "@/components/ui/kit/forms";

<Textarea placeholder="Write a few lines" />

Every state

Textarea

Select

▾

Usage

Do

  • Size the textarea for the answer you expect: a few lines, not a page.

Don’t

  • Don’t use a select for two options; a pair of radios is quicker to read.

Tokens it uses

Tokens it uses
--paper…
--line-control…
--spark…
--ink…
--faint…
--font-body…

Values are read live from the stylesheet, so they follow the site theme.