Branch: master
Find file History
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Type Name Latest commit message Commit time
Failed to load latest commit information.


The Checkbox component is used to create a styled checkbox, with or without a label. You can also create a custom checkbox using SVG icons.





Property Type Description Default
id string Adds id attribute. required
name string Adds name attribute.
disabled boolean Adds disabled attribute. false
checked boolean Adds checked attribute. false
size string Changes the width and height of the icon. 18px
icon-on string Add a custom SVG icon on state.
icon-off string Add a custom SVG icon for the off state.
color string Changes the color of the icon. --primary
tabindex number Add a tabindex for the checkbox.
theme string Adds a theme color (light, dark or whatever is defined in your base CSS. light

Instance Properties

Method Description
value A getter/setter that returns true if the checkbox is checked or false if the checkbox is not checked.

Static Methods

Method Description
addIcon(state, fn) Add a custom SVG as the icon for the given state Where the state parameter is either on or off and the fn parameter is a function that returns your SVG's xml. The function will receive the color prop as an argument.