TextInput is a form component to add default styling to the native text input. Don't forget to set aria-label to make the TextInput accessible to screen reader users.

Default example

System props

TextInput components get COMMON system props. Read our System Props doc page for a full list of available props.

Component props

Native <input> attributes are forwarded to the underlying React input component and are not listed below.

blockBooleanAdds display: block to element
variantStringCan be either small or large. Creates a smaller or larger input than the default.