# FontAwesome icon with incorrect color

**URL:** <https://discourse.nodered.org/t/fontawesome-icon-with-incorrect-color/16521>\
**Category:** Developing Nodes\
**Created:** [9 October 2019 21:43 UTC](https://discourse.nodered.org/t/fontawesome-icon-with-incorrect-color/16521 "2019-10-09T21:43:09Z")\
**Posts on this page:** 1\
**Showing post:** 30

<div class="post-metadata">

**Author:** ![Steve-Mcl](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/steve-mcl/32/4826_2.png) [@Steve-Mcl](https://discourse.nodered.org/u/Steve-Mcl)\
**Post date:** [12 October 2019 10:19 UTC](https://discourse.nodered.org/t/fontawesome-icon-with-incorrect-color/16521/30 "2019-10-12T10:19:23Z")

</div>

Morning @BartButenaers, @dceejay

So working on the above info and what Dave suggested, I now have a working solution.

Watch..  
 ![2019-10-12_11-06-17](https://us1.discourse-cdn.com/flex026/uploads/nodered/original/2X/1/1b818f4cd04c06a03adfc8633b5b8398f2d6749b.gif)

What i did

- added class `ui-svg` to the parent `div` of the `svg`
- added a local `<style>` element to override some style settings...

```css
div.ui-svg svg{
    color: var(--nr-dashboard-widgetColor);
    fill: currentColor !important;
}

div.ui-svg path {
    fill: inherit !important;
}

```

...This targets only our nodes SVG only and permits style fill setting. Phew.  
(_TODO: Check attribute setting `fill` works_)

**QUESTIONS**

1. You will notice I default the `color` to css variable `--nr-dashboard-widgetColor` - @dceejay is this the correct variable?

2. @BartButenaers are you happy with using dashboard css color setting as the fall back (i.e. when no fill is specified - inherit the dashboards css variable value)? or should it just be none? The difference I see is someone pasting SVG from another application, where no fill is set, they will suddenly see their path items now have colour.

3. Are there any other SVG elements set by dashboard CSS that we need to consider?

Steve.

---

_[View the full topic](https://discourse.nodered.org/t/fontawesome-icon-with-incorrect-color/16521)._