Ion-select set icon color

Ionic Framework ionic-v3
1

Hi
I’m using
<ion-select> component and I would like to change the icon color but I’m not able to do this. How is it possible to customize it?

This is my code

 <ion-row >
      <ion-label text-right>Scegli punti di interesse</ion-label>
        <ion-select [(ngModel)] = "sort" (ionChange)="changeImageMap()">
          <ion-option value="1">Blu e nero</ion-option>
          <ion-option value="2">Rosso</ion-option>
          <ion-option value="3">Blu</ion-option>
        </ion-select>
    </ion-row>

And this is the result.

Senza%20titolo%201
Senza titolo 1.jpg705×101 9.27 KB

I would like to change the icon’s color like that for example:

Senza%20titolo%2012
Senza titolo 12.png705×101 4.6 KB

Is it possible?
I’ve tried to change the css of the component but nothing worked.

Thank you.

2

.scss

ion-select {
  .select-icon {
    .select-icon-inner {
       color : red !important;
    }
  }
}
1 Like
3

thank you so much! this works!

1 Like
4

No. Its not working on ionic 4.

2 Likes
5

This solution not working on ionic 4.
Please update if you have solution regarding this icon color

6

ionic5 not work, please update

8

This question just for Ionic 3.

In Ionic v4/v5 you can use
ion-select::part(icon) { color: red !important; }