score:5

you can add custom classes to it:

<checkbox
    label="check this box"
    onchange={() => dispatch(switchcompleted())}
    checked={status.showcompleted}
    classes={{root: 'custom-checkbox-root'}}
  />

and then in a css file:

.custom-checkbox-root .muisvgicon-root{
  width: 36px;
  height: 36px;
}

you can check out more in api docs

score:10

since the checkbox item is actually an svg image, you can increase its size with transform.

you could style the checkbox with an inline style like below:

<checkbox
        style={{
            transform: "scale(2)",
        }}
    />

if you're using the material ui styling solution, you can achieve this with a class.

const usestyles = makestyles((theme) => ({
    ticksize: {
        transform: "scale(1.5)",
    },
}));

you can then apply the above class to your checkbox(s):

<checkbox color="default" classname={classes.ticksize} />

Related Query

More Query from same tag