Change Checkbox Size in Angular Material Selection List

Question

Is it possible to change the size of the checkbox in an Angular Material Selection List? I've tried changing the size of the mat-pseudo-checkbox in CSS but that results in the checkmark not being placed properly:

mat-pseudo-checkbox {
  height: 10px;
  width: 10px;
}

Is there another selector that I need to adjust to correct this?

Answer 1

With Angular 7 I succeeded with:

mat-checkbox ::ng-deep .mat-checkbox-inner-container {width: 30px;height: 30px;}

Answer 2

I was facing the similar issue and tried the below CSS, which seems to work in Angular 8:

::ng-deep .mat-checkbox .mat-checkbox-inner-container {
    width: 30px;
    height: 30px;
}

I have added a sample width and height; please customize these to what you need.