Input [Text]

Overview

Input Text is the core text entry component of Create UI. It covers every common input context out of the box, from plain text and email to passwords, search, phone numbers, amounts, and card details. Each of the 11 variants ships with the exact inner layout its context demands, so you never need to rebuild or repurpose a generic input.

When should you use them?

Use a text input any time you collect typed information from a user, such as a form field, a search bar, or a settings value. Pick the variant that matches the data you're collecting, so users get the right inner controls, formatting, and keyboard hints automatically.

How should you use them?

• Choose the variant that matches the data (E-Mail, Password, Phone Number, Amount, and others) instead of a generic input.
• Always pair inputs with a visible label, and use helper text to explain format or requirements.
• Use the Error state with a clear message when validation fails, so users know how to fix it.
• Show the Loading state during async checks like availability or validation.
• Pick the size for the context: MD for forms, SM or XS for compact settings panels.
• Keep inputs keyboard-accessible with proper labels for screen readers.