iCheck components built with React. Highly customizable checkboxes and radio buttons
npm install react-icheckTab, Spacebar, Arrow up/down and other shortcuts
sh
npm install react-icheck icheck --save
`
`js
import 'icheck/skins/all.css'; // or single skin css
import {Checkbox, Radio} from 'react-icheck';
// Checkbox with label
checkboxClass="icheckbox_square-blue"
increaseArea="20%"
label="Checkbox"
/>
// without label
id="checkbox1"
checkboxClass="icheckbox_square-blue"
increaseArea="20%"
/>
// Radio
name="aa"
radioClass="iradio_square-blue"
increaseArea="20%"
label="Radio"
/>
`
`js
import {Radio, RadioGroup} from 'react-icheck';
value="3"
radioClass="iradio_square-blue"
increaseArea="20%"
label="Radio, #input-3"
/>
value="4"
radioClass="iradio_square-blue"
increaseArea="20%"
label="Radio, #input-4"
/>
value="5"
radioClass="iradio_square-blue"
increaseArea="20%"
label="Radio, #disabled"
disabled
/>
`
More examples: Online demo, Source
Browser support
iCheck is verified to work in Internet Explorer 6+, Firefox 2+, Opera 9+, Google Chrome and Safari browsers. Should also work in many others.
Mobile browsers (like Opera mini, Chrome mobile, Safari mobile, Android browser, Silk and others) are also supported. Tested on iOS (iPad, iPhone, iPod), Android, BlackBerry and Windows Phone devices.
Contribute
Dev base on react-component-tools
`sh
$ git clone https://github.com/luqin/react-icheck.git
$ cd react-icheck
$ npm install
$ npm start # Run the docs site in development mode. This will watch for file changes as you work. And auto refresh the page to see the updates.
``