How to change background color of specific angular material tabs?

Question

I have a component using mat tab from angular material 7.

I want to change the background color of my tabs depending on a boolean value of my typescript variable.

Answer 1

You might not want to set encapsulation: ViewEncapsulation.None, this will make the styling for this component be applied to all other components too.

Instead you can set the color for the tab in your styles.scss like this:

.mat-tab-header{
    background-color: #424242;
}