Text Input

The most basic of all inputs.

Sizes

<TextInput placeholder="Large" size="lg" />
<TextInput placeholder="Medium" size="md" />
<TextInput placeholder="Small" size="sm" />

Labels

<TextInput label="Label" />
<TextInput label="Cool" />
<TextInput>
	<span class="text-green-800 dark:text-green-400 font-black" slot="label">
		It can be used as a slot, too.
	</span>
</TextInput>

Prefix/Suffix

<TextInput>
	<span class="text-green-800 dark:text-green-400 font-black" slot="label">Slot label</span>
	<span slot="prefix">https://</span>
	<span slot="suffix">.com</span>
</TextInput>

Inline

States

Text Area

A multi-row input.