CODEWITHSUNDEEP
cssangularangular-materialtagsstyles
user9436741
user9436741

Reputation:

Change Angular mat chip default colors

I'm new to Angular and I'm trying to to change mat chip default colors using global CSS file but some reason it won't let me change the default chip color and inside text color.

Homepage.component HTML

      <mat-chip-list>
        <mat-chip>Tag1</mat-chip>
      </mat-chip-list>

Global CSS

.mat-chip{
    background-color:mat-color($accent);
    color: mat-contrast($positive,50);
}

This is what it look like inside mat-card

Upvotes: 3

Views: 10581

Answers (1)

Thierry Falvo
Thierry Falvo

Reputation: 6290

You can use !important operator, as below :

.mat-chip{
  background-color: mat-color($accent) !important;
  color: mat-contrast($positive,50) !important;
}

Upvotes: 6

Related Questions