Input field

<InputField
	value={value}
	onChange={(value) => setValue(value)}
	placeholder='Basic text input'
/>

Note

If you're not setting a label, add an aria-label to help describe the field to users that use screen readers.

Highlighted props

For the complete list of props, use your IDE's autocomplete functionality.

Field type

Monospace font

Makes it harder to confuse certain characters in IDs, passwords, or similar types of data.

<InputField
	value={value}
	onChange={(value) => setValue(value)}
	monospaceFont
/>