Change color bullet ION SLIDES V4?

Ionic Framework ionic-v3
1

how to change color bullet in ionic 4 on slides dot? please not work .swiper-pagination { padding: 3px; bottom:0px; .swiper-pagination-bullet { background: #FFF; margin: 0 3px; } }

3 Likes
2

please help me …i don’t know i prove all :frowning:

3

In the SCSS that accompanies the template add:

ion-slides {
    --bullet-background: red;
    --bullet-background-active: rebeccapurple;
}

You might want adjust the opacity of the non-active bullet. By default it is .2, so any color you set will be very faint.

6 Likes
4

thanks but for modify border of bullet?

5

I don’t think that value is exposed. You can open an issue on Github for it.

1 Like
7

thanks but for modify border of bullet?

To do that you could use radial gradient, like this:

–bullet-background: radial-gradient(circle, transparent 30%, red 40%);
–bullet-background-active: radial-gradient(circle, transparent 30%, rebeccapurple 40%);

8

thanks its work perfect