Text Input

Area where user can enter small amount of text. Commonly used in forms.

Note: This kit does not handle form validation logic.

Default


With Error


Text Input w/ Error shows that the radio option must be selected or is invalid (ie when used in a form it signals a user to fix an error).

Custom


Disabled


Add On


Inline


No Label



Things to Avoid

Do not use for large amounts of text (use Textarea instead). Avoid using a text input without validation if input is required and using with validation if not required.

UI Samples using Text Input Kit

Get the full picture. See how this kit is used in our samples.

Available Props