# Ion-select set icon color

**URL:** <https://forum.ionicframework.com/t/ion-select-set-icon-color/136963>\
**Category:** ionic-v3\
**Created:** [August 1, 2018, 9:43am UTC](https://forum.ionicframework.com/t/ion-select-set-icon-color/136963 "2018-08-01T09:43:35Z")\
**Posts on this page:** 8\
**Page:** 1

<div class="post-metadata">

**Author:** ![JEricaM](https://avatars.discourse-cdn.com/v4/letter/j/b77776/32.png) [@JEricaM](https://forum.ionicframework.com/u/JEricaM)\
**Post date:** [August 1, 2018, 9:43am UTC](https://forum.ionicframework.com/t/ion-select-set-icon-color/136963/1 "2018-08-01T09:43:35Z")

</div>

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

```auto
 <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](https://global.discourse-cdn.com/ionicframework/original/3X/e/b/ebbd0d865f40227df6468ad5a53ef6bc5328e0da.jpg)

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

 ![Senza%20titolo%2012](https://global.discourse-cdn.com/ionicframework/original/3X/d/5/d55c4f0259843c5106f5ce7f6408b15655a1b5bc.png)

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

Thank you.

---

<div class="post-metadata">

**Author:** ![avishai\_peretz\_dev](https://avatars.discourse-cdn.com/v4/letter/a/b5ac83/32.png) [@avishai\_peretz\_dev](https://forum.ionicframework.com/u/avishai_peretz_dev)\
**Post date:** [August 1, 2018, 10:04am UTC](https://forum.ionicframework.com/t/ion-select-set-icon-color/136963/2 "2018-08-01T10:04:01Z")

</div>

.scss

```auto
ion-select {
  .select-icon {
    .select-icon-inner {
       color : red !important;
    }
  }
}

```

---

<div class="post-metadata">

**Author:** ![JEricaM](https://avatars.discourse-cdn.com/v4/letter/j/b77776/32.png) [@JEricaM](https://forum.ionicframework.com/u/JEricaM)\
**Post date:** [August 1, 2018, 10:27am UTC](https://forum.ionicframework.com/t/ion-select-set-icon-color/136963/3 "2018-08-01T10:27:09Z")

</div>

thank you so much! this works!

---

<div class="post-metadata">

**Author:** ![arindam\_mojumder](https://sea1.discourse-cdn.com/ionicframework/user_avatar/forum.ionicframework.com/arindam_mojumder/32/128061_2.png) [@arindam\_mojumder](https://forum.ionicframework.com/u/arindam_mojumder)\
**Post date:** [September 3, 2019, 11:51am UTC](https://forum.ionicframework.com/t/ion-select-set-icon-color/136963/4 "2019-09-03T11:51:49Z")

</div>

No. Its not working on ionic 4.

---

<div class="post-metadata">

**Author:** ![dkoli000](https://avatars.discourse-cdn.com/v4/letter/d/f04885/32.png) [@dkoli000](https://forum.ionicframework.com/u/dkoli000)\
**Post date:** [January 1, 2020, 11:35am UTC](https://forum.ionicframework.com/t/ion-select-set-icon-color/136963/5 "2020-01-01T11:35:34Z")

</div>

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

---

<div class="post-metadata">

**Author:** ![comadaihiep92](https://sea1.discourse-cdn.com/ionicframework/user_avatar/forum.ionicframework.com/comadaihiep92/32/132663_2.png) [@comadaihiep92](https://forum.ionicframework.com/u/comadaihiep92)\
**Post date:** [June 10, 2020, 7:27am UTC](https://forum.ionicframework.com/t/ion-select-set-icon-color/136963/6 "2020-06-10T07:27:41Z")

</div>

> [@Solved by avishai\_peretz\_dev in post #2](#):
>
> ```auto
> ion-select {
> .select-icon {
> .select-icon-inner {
> color : red !important;
> }
> }
> }
> 
> ```

ionic5 not work, please update

---

<div class="post-metadata">

**Author:** ![DeMeng](https://avatars.discourse-cdn.com/v4/letter/d/91b2a8/32.png) [@DeMeng](https://forum.ionicframework.com/u/DeMeng)\
**Post date:** [June 2, 2021, 8:09am UTC](https://forum.ionicframework.com/t/ion-select-set-icon-color/136963/8 "2021-06-02T08:09:33Z")

</div>

This question just for Ionic 3.

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

---

<div class="post-metadata">

**Author:** ![mhartington](https://sea1.discourse-cdn.com/ionicframework/user_avatar/forum.ionicframework.com/mhartington/32/137757_2.png) [@mhartington](https://forum.ionicframework.com/u/mhartington)\
**Post date:** [July 19, 2021, 8:51pm UTC](https://forum.ionicframework.com/t/ion-select-set-icon-color/136963/9 "2021-07-19T20:51:49Z")

</div>

Closed on July 19, 2021, 8:51pm UTC


