Design AtlasBuilt on a multi-line <textarea>, not a single-line <input>. The core trick is autosize: on every input, reset height to auto, then set it to scrollHeight, so the box grows with content instead of scrolling internally — until it hits a max height, at which point it switches to internal scroll.
The send button stays disabled while the input is empty and fills with color once there's text, previewing whether sending is even possible right now. Enter to send and Shift+Enter for a newline is the convention, though some mobile users expect the opposite — match the platform.
The attach icon often doubles as file/image upload, and a mic icon switches to voice input. More buttons means a narrower text area, so it's worth tucking rarely-used actions behind a + menu instead of lining them all up.
When to use
The default input component for almost any conversational AI product. If input is reliably a single short command, autosize may be more machinery than you need.