# The icon component in 8.1 doesn't accept css3 fill property in style class **URL:** \ **Category:** Ignition Early Access\ **Created:** [April 15, 2021, 4:22pm UTC](https://forum.inductiveautomation.com/t/the-icon-component-in-8-1-doesnt-accept-css3-fill-property-in-style-class/45646 "2021-04-15T16:22:17Z")\ **Posts on this page:** 9\ **Page:** 1
**Author:** ![nader.chinichian](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/nader.chinichian/32/9261_2.png) [@nader.chinichian](https://forum.inductiveautomation.com/u/nader.chinichian)\ **Post date:** [April 15, 2021, 4:22pm UTC](https://forum.inductiveautomation.com/t/the-icon-component-in-8-1-doesnt-accept-css3-fill-property-in-style-class/45646/1 "2021-04-15T16:22:17Z")
Hi The icon component in 8.1 doesn’t accept css3 fill property in style class. If I use the fill property in the style section of component property it accepts the color but not in style classes. ![image](https://us1.discourse-cdn.com/inductiveautomation/original/3X/c/2/c29d1bac83e935b8ab13155efd912c61ec0f850c.png) In the previous version, this works. If this doesn’t work I don’t have control over hover effect. ---
**Author:** ![swolnisty](https://avatars.discourse-cdn.com/v4/letter/s/7bcc69/32.png) [@swolnisty](https://forum.inductiveautomation.com/u/swolnisty)\ **Post date:** [April 15, 2021, 4:29pm UTC](https://forum.inductiveautomation.com/t/the-icon-component-in-8-1-doesnt-accept-css3-fill-property-in-style-class/45646/2 "2021-04-15T16:29:57Z")
The icons’ fill color seems to be based on the text color attribute of a style class, if I remember correctly. I’m not sure if this is intentional or a bug, but it’s weird either way. ---
**Author:** ![nader.chinichian](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/nader.chinichian/32/9261_2.png) [@nader.chinichian](https://forum.inductiveautomation.com/u/nader.chinichian)\ **Post date:** [April 15, 2021, 5:11pm UTC](https://forum.inductiveautomation.com/t/the-icon-component-in-8-1-doesnt-accept-css3-fill-property-in-style-class/45646/3 "2021-04-15T17:11:23Z")
> [@swolnisty](#): > > based You are right about it. it is so weird. I hope this is a bug and IA fix it and not intentional. ---
**Author:** ![nminchin](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/nminchin/32/6911_2.png) [@nminchin](https://forum.inductiveautomation.com/u/nminchin)\ **Post date:** [April 15, 2021, 6:25pm UTC](https://forum.inductiveautomation.com/t/the-icon-component-in-8-1-doesnt-accept-css3-fill-property-in-style-class/45646/4 "2021-04-15T18:25:16Z")
if you want to use a style, you need to set the props.color to ‘unset’. This will force it to revert to its parent style config ---
**Author:** ![YF129701](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/yf129701/32/60498_2.png) [@YF129701](https://forum.inductiveautomation.com/u/YF129701)\ **Post date:** [April 15, 2021, 6:57pm UTC](https://forum.inductiveautomation.com/t/the-icon-component-in-8-1-doesnt-accept-css3-fill-property-in-style-class/45646/5 "2021-04-15T18:57:38Z")
When I set `props.color` to `unset`, I get a red triangle saying `color: does not match the format for color` although the `fill` property from the style class does apply in that case. Interesting… ---
**Author:** ![nminchin](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/nminchin/32/6911_2.png) [@nminchin](https://forum.inductiveautomation.com/u/nminchin)\ **Post date:** [April 15, 2021, 6:58pm UTC](https://forum.inductiveautomation.com/t/the-icon-component-in-8-1-doesnt-accept-css3-fill-property-in-style-class/45646/6 "2021-04-15T18:58:18Z")
It’s only a warning as it doesn’t match Igntion’s expected type (it’s still valid css though), you get that when using css variables as well ---
**Author:** ![nader.chinichian](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/nader.chinichian/32/9261_2.png) [@nader.chinichian](https://forum.inductiveautomation.com/u/nader.chinichian)\ **Post date:** [April 15, 2021, 7:16pm UTC](https://forum.inductiveautomation.com/t/the-icon-component-in-8-1-doesnt-accept-css3-fill-property-in-style-class/45646/7 "2021-04-15T19:16:33Z")
At the end svg shape should use fill and not color property and it is bug in 8.1.x ---
**Author:** ![nminchin](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/nminchin/32/6911_2.png) [@nminchin](https://forum.inductiveautomation.com/u/nminchin)\ **Post date:** [April 15, 2021, 7:18pm UTC](https://forum.inductiveautomation.com/t/the-icon-component-in-8-1-doesnt-accept-css3-fill-property-in-style-class/45646/8 "2021-04-15T19:18:20Z")
Ah, yes, I missed that part. Still an issue I guess, although if you think about it, icons are used within text which _should_ use the text colour. I guess that got passed onto the icon component itself. Changing it now would probably break everyone’s projects 🤷‍♂️ ---
**Author:** ![nader.chinichian](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/nader.chinichian/32/9261_2.png) [@nader.chinichian](https://forum.inductiveautomation.com/u/nader.chinichian)\ **Post date:** [April 15, 2021, 7:33pm UTC](https://forum.inductiveautomation.com/t/the-icon-component-in-8-1-doesnt-accept-css3-fill-property-in-style-class/45646/9 "2021-04-15T19:33:41Z")
For me it did break my 8.0.x projects 😔