How do I change ionic slider pager dots/circles color when active to yellow and inactive to white?

For those using Ionic 4, you'll need to set the color within ion-slides like so:

ion-slides {
   --bullet-background: white;
   --bullet-background-active: yellow;
}

Further details can be found in the docs


In Ionic 3 use these classes:

.swiper-pagination-bullet {
    background: white;
    opacity: 0.5;
  }

  .swiper-pagination-bullet-active {
    opacity: 1;
    background: white;
  }

enter image description here


I'm sure slider pager should work try this:

.slider-pager-page
{
  color: white;
  fill: #f90;
  stroke: red;
  background-color: blue;
}
.slider-pager-page.active
{
  fill: #f90;
  stroke: red;
  color: blue;
  background-color: red;
}

i'm including some background color so you can identify more easily.