Home > Enterprise >  How to change the inner RippleColor and UnboundedRipple effects in Angular material button?
How to change the inner RippleColor and UnboundedRipple effects in Angular material button?

Time:08-25

I have used the following material design button in my project:-

<button  mat-raised-button>Save Changes</button>

I want to change its default ripple color. I tried this:-

<button  mat-raised-button matRipple [matRippleUnbounded]="false" [matRippleColor]="rgba(255,255,0,0.3)">Save Changes</button>

My desired color is applied but the ripple effect is unbounded. I cannot bound it.

How can I fix this problem?

CodePudding user response:

As others said, it seems to be a bug in angular material. You can simply use overflow: hidden as CSS style.

  • Related