Salad UI

Checkbox

Renders a checkbox input with SaladUI styling.

Read more Read less

Options

  • :id - The id to apply to the checkbox
  • :name - The name to apply to the input field
  • :value - The current value of the checkbox
  • :default-value - The default value of the checkbox, either true, false, “true”, “false”
  • :disabled - Whether the checkbox is disabled
  • :field - A Phoenix form field
  • :class - Additional classes to add to the checkbox
Checkbox checked Open in playground 
<div className="flex items-center space-x-2">
<.checkbox id="checked" value={true}/>
<.label for="checked">I'm a label</.label>
</div>
Checkbox Open in playground 
<div className="flex items-center space-x-2">
<.checkbox id="unchecked"/>
<.label for="unchecked">I'm a label</.label>
</div>