mat-checkbox custom color cannot be changed

ripple is the name of the water drop ripple effect that is displayed when you click on Material components, so you're targeting the wrong element.

Use:

// overwrite the checkbox background
::ng-deep .mat-checkbox-checked .mat-checkbox-background, 
.mat-checkbox-indeterminate .mat-checkbox-background {
  background-color: black !important;
}

// overwrite the ripple overlay on hover and click
::ng-deep .mat-checkbox:not(.mat-checkbox-disabled) .mat-checkbox-ripple .mat-ripple-element {
  background-color: black !important;
}

If you want to change the color globally it's better to use theming.

Use global scss in styles.scss and that should work.

.mat-checkbox-checked.mat-accent .mat-checkbox-background,
.mat-checkbox-indeterminate.mat-accent .mat-checkbox-background {
    background-color: black;
}