Checkbox - Keep React

The Checkbox Component is a user interface element that allows users to toggle between two states, typically representing selection or deselection. It consists of a small box that can be checked (selected) or unchecked (deselected). Checkboxes are commonly used in forms, lists, and interactive interfaces to enable users to make multiple selections or indicate their preferences.

Default Checkbox#

The default checkbox is a square checkbox that can be checked or unchecked.

Checkbox

Checkbox Variant#

The Checkbox component offers two variants: square and circle. You can use the variant prop to specify the desired variant.

Square

Circle

Disabled Checkbox#

You can disable the checkbox by setting the disabled prop to true.

Disabled

API Reference#

Here is a list of the props that you can pass to the Checkbox component:

Property	Description	Type	Default
size	Available size options for checkbox.	sm md lg	md
label	Checkbox label text	string	Checkbox
color	Checkbox Color	info warning error success	info
labelColor	Checkbox Color	info warning error success	info
variant	Checkbox Variant	square circle	square
id	Checkbox Input Field ID	string	one
fieldName	Checkbox Input Field Name	string	checkbox