how to change the icon color by changing it in $mat-light-theme-foreground?

[pedram khoshdani]

Hi everyone,

I am going to override the colors for some of the components in Angular Material. I tried to override "icon" variable in "$mat-light-theme-foreground" as shown below, but that doesn't do it, instead the icon color changes when I change "text" variable inside "$mat-light-theme-foreground". Please note that I have already applied my custom theme to my application, but still want to change some of the specific colors of the Angular Material components.

@import '~@angular/material/theming';

$mat-light-theme-foreground: (

  icon: green,

  icons: green,

  // text: green

);

Thanks in advance!