# Change icon color without changing text color on button?

**URL:** <https://discourse.nodered.org/t/change-icon-color-without-changing-text-color-on-button/34975>\
**Category:** Dashboard\
**Created:** [28 October 2020 19:21 UTC](https://discourse.nodered.org/t/change-icon-color-without-changing-text-color-on-button/34975 "2020-10-28T19:21:23Z")\
**Posts on this page:** 5\
**Page:** 1

<div class="post-metadata">

**Author:** ![Nodi.Rubrum](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/nodi.rubrum/32/107482_2.png) [@Nodi.Rubrum](https://discourse.nodered.org/u/Nodi.Rubrum)\
**Post date:** [28 October 2020 19:21 UTC](https://discourse.nodered.org/t/change-icon-color-without-changing-text-color-on-button/34975/1 "2020-10-28T19:21:24Z")

</div>

Change icon color without changing text color on button? Based on what i have seen, done, so far, it seems like you can't change the icon color separate from text color?

---

<div class="post-metadata">

**Author:** ![hotNipi](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/hotnipi/32/383_2.png) [@hotNipi](https://discourse.nodered.org/u/hotNipi)\
**Post date:** [28 October 2020 19:57 UTC](https://discourse.nodered.org/t/change-icon-color-without-changing-text-color-on-button/34975/2 "2020-10-28T19:57:51Z")

</div>

I think it is possible. I'm on phone right now so can't do much but .....  
The icon in button can have many classes defined (fa fa2x ....), including custom classes. So the color in custom class may do the trick

---

<div class="post-metadata">

**Author:** ![hotNipi](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/hotnipi/32/383_2.png) [@hotNipi](https://discourse.nodered.org/u/hotNipi)\
**Post date:** [29 October 2020 06:04 UTC](https://discourse.nodered.org/t/change-icon-color-without-changing-text-color-on-button/34975/3 "2020-10-29T06:04:01Z")

</div>

So yes, it is possible. Not directly but via `msg.ui_control`

```auto
[{"id":"1e679465.35c78c","type":"ui_button","z":"9038de34.04db3","name":"","group":"110f893b.a0f1d7","order":0,"width":0,"height":0,"passthru":false,"label":"home button","tooltip":"","color":"","bgcolor":"","icon":"{{msg.icon}}","payload":"","payloadType":"str","topic":"","x":450,"y":220,"wires":[[]]},{"id":"4a88b538.b3406c","type":"inject","z":"9038de34.04db3","name":"red icon","props":[{"p":"ui_control.icon","v":"fa-home fa-2x coloredIcon red","vt":"str"}],"repeat":"","crontab":"","once":true,"onceDelay":0.1,"topic":"","x":260,"y":200,"wires":[["1e679465.35c78c"]]},{"id":"b0887b83.fa5e78","type":"ui_template","z":"9038de34.04db3","group":"110f893b.a0f1d7","name":"","order":1,"width":0,"height":0,"format":"<style>\n .coloredIcon.red{\n color :red;\n }\n .coloredIcon.blue{\n color :blue;\n }\n</style>","storeOutMessages":true,"fwdInMessages":true,"resendOnRefresh":true,"templateScope":"local","x":440,"y":160,"wires":[[]]},{"id":"42a32029.aade","type":"inject","z":"9038de34.04db3","name":"blue icon","props":[{"p":"ui_control.icon","v":"fa-home fa-2x coloredIcon blue","vt":"str"}],"repeat":"","crontab":"","once":false,"onceDelay":0.1,"topic":"","x":260,"y":260,"wires":[["1e679465.35c78c"]]},{"id":"110f893b.a0f1d7","type":"ui_group","name":"Default","tab":"7179c13.0628d4","order":13,"disp":true,"width":"6","collapse":false},{"id":"7179c13.0628d4","type":"ui_tab","name":"Dashboard","icon":"dashboard","order":1,"disabled":false,"hidden":false}]

```

---

<div class="post-metadata">

**Author:** ![Nodi.Rubrum](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/nodi.rubrum/32/107482_2.png) [@Nodi.Rubrum](https://discourse.nodered.org/u/Nodi.Rubrum)\
**Post date:** [30 October 2020 04:46 UTC](https://discourse.nodered.org/t/change-icon-color-without-changing-text-color-on-button/34975/4 "2020-10-30T04:46:10Z")

</div>

Oh cool. Guess WHAT I AM PLAYING WITH TOMORROW!!! LOL.

---

<div class="post-metadata">

**Author:** ![system](https://us1.discourse-cdn.com/flex026/uploads/nodered/original/1X/d073cd938eafa2e558d7c2cd59003b3ef4963033.png) [@system](https://discourse.nodered.org/u/system)\
**Post date:** [29 November 2020 04:46 UTC](https://discourse.nodered.org/t/change-icon-color-without-changing-text-color-on-button/34975/5 "2020-11-29T04:46:14Z")

</div>

This topic was automatically closed 30 days after the last reply. New replies are no longer allowed.