WARNING! You are browsing the docs for an old version of TallStackUI!

Powerful suite of Blade components for TALL Stack apps.

Form Checkbox

Form checkbox component.

WARNING!

You are browsing the docs for an old version of TallStackUI. Consider upgrade your project to TallStackUI v3.

<x-checkbox />
<x-checkbox label="Receive Alert" />
 
<x-checkbox label="Receive Alert" position="left" />
<x-checkbox>
<x-slot:label>
I agree to the <a href="#">terms and conditions</a>
</x-slot:label>
</x-checkbox>
<x-checkbox>
<x-slot:label>
Align on Middle
</x-slot:label>
</x-checkbox>
 
<x-checkbox>
<x-slot:label start>
Align on Start
</x-slot:label>
</x-checkbox>
<x-checkbox xs />
<x-checkbox sm />
<x-checkbox md />
<x-checkbox lg />
<x-checkbox label="Primary" />
<x-checkbox color="secondary" label="Secondary" />
<x-checkbox color="slate" label="Slate" />
<x-checkbox color="gray" label="Gray" />
<x-checkbox color="zinc" label="Zinc" />
<x-checkbox color="neutral" label="Neutral" />
<x-checkbox color="stone" label="Stone" />
<x-checkbox color="red" label="Red" />
<x-checkbox color="orange" label="Orange" />
<x-checkbox color="amber" label="Amber" />
<x-checkbox color="yellow" label="Yellow" />
<x-checkbox color="lime" label="Lime" />
<x-checkbox color="green" label="Green" />
<x-checkbox color="emerald" label="Emerald" />
<x-checkbox color="teal" label="Teal" />
<x-checkbox color="cyan" label="Cyan" />
<x-checkbox color="sky" label="Sky" />
<x-checkbox color="blue" label="Blue" />
<x-checkbox color="indigo" label="Indigo" />
<x-checkbox color="violet" label="Violet" />
<x-checkbox color="purple" label="Purple" />
<x-checkbox color="fuchsia" label="Fuchsia" />
<x-checkbox color="pink" label="Pink" />
<x-checkbox color="rose" label="Rose" />
<x-checkbox color="black" label="Black" />

Code highlighting provided by Torchlight