Checkbox icon style issue material ui

Question

I am trying to customise the checkbox icon colour and also the checked colour as well but am having difficulties doing so.

Seems as if iconStyle doesn't work here? The checkbox still remains black box colour and blue checked.

http://www.webpackbin.com/EkQIozSFf

How can I customise the box colour and checked colour of the icon?

Answer 1

import { Checkbox } from 'material-ui';
import UnCheckedIcon from 'material-ui/svg-icons/toggle/check-box-outline-blank';
import CheckedIcon from 'material-ui/svg-icons/toggle/check-box'

export default class HelloWorld extends React.Component {
  constructor(props) {
  super(props);
}

render() {

return (
  <Checkbox 
    uncheckedIcon={<UnCheckedIcon style={{fill: "#ff0000"}} />}
    checkedIcon={<CheckedIcon style={{fill: "#ff0000"}} />}
    label="Checkbox Label"/>
)}}

this should work