Koori UI
Components

GlassTextarea

A glassmorphism-styled textarea that extends the native HTML textarea element.

Preview

Usage

import { GlassTextarea } from "koori-ui";
 
<GlassTextarea placeholder="Write something..." />
<GlassTextarea rows={6} placeholder="Longer input area" />

Controlled

import { useState } from "react";
import { GlassTextarea } from "koori-ui";
 
function Example() {
  const [value, setValue] = useState("");
  return (
    <GlassTextarea
      value={value}
      onChange={(e) => setValue(e.target.value)}
      placeholder="Your message..."
    />
  );
}

Disabled

<GlassTextarea disabled placeholder="Disabled textarea" />

Props

PropTypeDefaultDescription
rowsnumber3Minimum number of visible rows
placeholderstringPlaceholder text
disabledbooleanfalseDisables the textarea
classNamestringAdditional CSS classes

All native <textarea> props are also accepted.

On this page