Styling: Giving an ion-icon a gradient background (ion-chip)

Hi everyone :slight_smile:

I’m trying to give an icon a gradient background.

I haven’t had any success doing so.

Does anyone have an idea how to do this?

I tried putting the ion-icon into a ion-chip, like this:

<ion-chip class="my-chip">
   <ion-icon name="basket></ion-icon>

And then in the .css file:

  color: linear-gradient( 0deg, #color1 0%, #color2 100%) !important;

But this didn’t work.
Color one and color two are obviously given in hex code :slight_smile:
Any help would be much appreciated!