Ripple color of ion-back-button is not working

I’m trying to set the ripple color for the back button using the ionic’s custom CSS property (--ripple-color). However, I don’t see that working. Here’s my piece of code

header.html

<!-- Default back button -->
<ion-header>
  <ion-toolbar>
    <ion-buttons slot="start">
      <ion-back-button defaultHref="/" text=""></ion-back-button>
    </ion-buttons>
  </ion-toolbar>
</ion-header>

header.scss

ion-back-button {
  --ripple-color: red;
}

1 post - 1 participant

Read full topic