HTML + CSSInputs
Auto-growing text area
Starts as a single line, grows with every new line you write and its focus ring gently breathes.
Settings
16px
1x
Code
<label class="uv-in2gr"><textarea rows="1" placeholder="Tell me something…"></textarea></label>Prompt for AI
Paste it into ChatGPT, Claude or Cursor and it will adapt the block to your project with these settings, even if you don’t use React.
More in Inputs
Where to use it
A text box that grows as you write feels lighter than a big empty rectangle, which makes people more willing to start. Good spots for it: the comment box under a blog post, the message field of a support chat or the notes of a booking form. An auto-resize textarea in HTML and CSS, with a few lines of JavaScript.
It works best for short to medium messages. For long texts such as a cover letter or a detailed complaint, start with a taller box so the page does not keep jumping while people type.