How to change radio color on selected ion-select

Question

I created this select My ion-select

So I changed the color of the buttons to cancel and Ok, so far everything as it should be. My problem is that I can't change the color of the selected radio. the default color is blue, i would like to change the radio color when selected.

<ion-select id="category" cancelText="Cancelar" okText="Confirmar" multiple="true" value="" placeholder="Selecionar">
  <ion-select-option color="verde" value="Acessórios para Veículos">Acessórios para Veículos</ion-select-option>
  <ion-select-option value="Alimentos e Bebidas">Alimentos e Bebidas</ion-select-option>
  <ion-select-option value="Animais">Animais</ion-select-option>
  <ion-select-option value="Antiguidades e Coleções">Antiguidades e Coleções</ion-select-option>
  <ion-select-option value="Arte e Papelaria ">Arte e Papelaria </ion-select-option>
</ion-select>

Answer 1

You need to adapt the answer to your case :

• In your html, add the [interfaceOptions] :

  <ion-select [interfaceOptions]="customAlertOptions" id="category" cancelText="Cancelar" okText="Confirmar" multiple="true" value="" placeholder="Selecionar">
     <ion-select-option color="verde" value="Acessórios para Veículos">Acessórios para Veículos</ion-select-option>
     <ion-select-option value="Alimentos e Bebidas">Alimentos e Bebidas</ion-select-option>
     <ion-select-option value="Animais">Animais</ion-select-option>
     <ion-select-option value="Antiguidades e Coleções">Antiguidades e Coleções</ion-select-option>
     <ion-select-option value="Arte e Papelaria ">Arte e Papelaria </ion-select-option>
  </ion-select>
  

• In your ts file, add the CssClass

  export class HomePage {
  
    customAlertOptions: any = {
      cssClass: 'customAlertCss',
  
    };
     ....
  }
  

• In the global.scss you add what you need. The console help you find the class to modify most of the time

   .customAlertCss {
       [aria-checked=true].sc-ion-alert-md .alert-checkbox-icon.sc-ion-alert-md {
           border-color: red !important;
           background-color: red !important;
    }
  
  }