1

I can not change the icon color "X" linked to this input of ionic:

<ion-input placeholder="Seach" clearInput ></ion-input>

Has anyone ever experienced this?

  • 1
    That element have `.searchbar-clear-icon` class. The "X" icon is an image background so you should change it via `background-image` – Duannx Dec 08 '17 at 05:01

1 Answers1

0

you can use .text-input-clear-icon class to override the css properties

  .text-input-clear-icon {
       background-image: url("imagePath")!important;
     }

Basically ionic adds a background-image in the .text-input-clear-icon which represents the X icon/symbol you see. so by simply overriding the background property, you can have your custom icons in place of the default one

You can also refer to the this link change placeholder and clear-icon color for ion-search bar not globally?

Ankit Pant
  • 325
  • 2
  • 10