Skip to content
+

Textarea Autosize

The Textarea Autosize component automatically adjusts its height to match the length of the content within.

Introduction

Textarea Autosize is a utility component that replaces the native <textarea> HTML. Its height automatically adjusts as a response to keyboard inputs and window resizing events.

By default, an empty Textarea Autosize component renders as a single row, as shown in the following demo:

Basics

Import

import TextareaAutosize from '@mui/material/TextareaAutosize';

Minimum height

Use the minRows prop to define the minimum height of the component:

Press Enter to start editing

Maximum height

Use the maxRows prop to define the maximum height of the component:

Press Enter to start editing

API

See the documentation below for a complete reference to all of the props and classes available to the components mentioned here.