Checkbox
SfCheckbox
is a wrapper around <input type="checkbox">
with additional styles for different states . It can be used for forms or expressing consents.
The root element is an <input>
so any attributes that can be used on an <input>
can be used on SfCheckbox
.
If you need to make this field required, it is crucial to communicate this intention clearly to your end users. You can find more information about required form fields in our guide here.
Examples
Checkbox without label
Checkbox aligned to the left
When using SfCheckbox
with a label, you can use Tailwind's peer
modifiers to control the styles of the label based on the state of the checkbox.
Checkbox aligned to the right
Accessibility notes
SfCheckbox
is a wrapper for <input type="checkbox">
so it inherits all the accessibility features of the native checkbox.
It's focusable and can be toggled with Space
.