SnackBar panelClass Not Working in Angular 16

Issue

Example: https://stackblitz.com/edit/myxj6y?file=src%2Fexample%2Fsnack-bar-overview-example.ts

I tried the class in styles.scss, with ng-deep, overriding the component's root class and it still doesn't work. I'm not using standalone components. What is wrong with the code ?

"@angular/material": "^16.2.9",
"@angular/common": "^16.2.0",

Solution

You can customize it now, by setting the variable colors with the custom class.

Please find below a working example!

.test {
  --mdc-snackbar-container-color: aqua !important;
  --mdc-snackbar-supporting-text-color: red !important;
  --mat-snack-bar-button-color: #ff4081;
}

stackblitz

Answered By - Naren Murali