# Updating Node's Background Color depending on config

**URL:** <https://discourse.nodered.org/t/updating-nodes-background-color-depending-on-config/32841>\
**Category:** Developing Nodes\
**Created:** [13 September 2020 23:48 UTC](https://discourse.nodered.org/t/updating-nodes-background-color-depending-on-config/32841 "2020-09-13T23:48:35Z")\
**Posts on this page:** 11\
**Page:** 1

<div class="post-metadata">

**Author:** ![pitus](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/pitus/32/28170_2.png) [@pitus](https://discourse.nodered.org/u/pitus)\
**Post date:** [13 September 2020 23:48 UTC](https://discourse.nodered.org/t/updating-nodes-background-color-depending-on-config/32841/1 "2020-09-13T23:48:35Z")

</div>

I'm trying to change the background color (`.color` property) of a custom node when the user links it via editor to another node so my node 'inherits' the linked node's color.  
This could be extended to changing node's background color for whatever other reason, options chosen in the node's configuration, number of outputs...  
However, when I try to set `this.color` or `this._def.color` in the `oneditsave`, there's no visual effect in the dashboard, the change to color property is ignored even when it's added to the `defaults` (something that works for # of outputs for example).  
How can this be achieved? How can someone change node's color using node editor?

---

<div class="post-metadata">

**Author:** ![dceejay](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/dceejay/32/38_2.png) [@dceejay](https://discourse.nodered.org/u/dceejay)\
**Post date:** [14 September 2020 06:34 UTC](https://discourse.nodered.org/t/updating-nodes-background-color-depending-on-config/32841/2 "2020-09-14T06:34:23Z")

</div>

The colour is not meant to be changeable. Flows are meant to be easy to "read" by looking at them. Part of that readability is consistency of colour, so that you can recognise what a node is by its colour.

---

<div class="post-metadata">

**Author:** ![TotallyInformation](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/totallyinformation/32/31_2.png) [@TotallyInformation](https://discourse.nodered.org/u/TotallyInformation)\
**Post date:** [14 September 2020 20:07 UTC](https://discourse.nodered.org/t/updating-nodes-background-color-depending-on-config/32841/3 "2020-09-14T20:07:13Z")

</div>

Rather than using the node colour, use the status msg. That should give you a decent indication.

---

<div class="post-metadata">

**Author:** ![pitus](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/pitus/32/28170_2.png) [@pitus](https://discourse.nodered.org/u/pitus)\
**Post date:** [17 September 2020 15:27 UTC](https://discourse.nodered.org/t/updating-nodes-background-color-depending-on-config/32841/4 "2020-09-17T15:27:09Z")

</div>

In my case, I need to change the background color exactly for consistency reasons!  
Here's the reason:

1. I have several node types that act as sources of information, each type using different color
2. A target node allow to subscribe to one of the sources for processing (I can't use link nodes for that, - the reasoning is beyond the scope of this request/question) - Once a source is chosen, I want the target node to "take" the color of the source so that I can visually see what source it links to.

Note that the change doesn't happen at run-time but only at design time - exiting from the node editor should allow to set the color of the node in my opinion, it would be beneficial not just in my case.

---

<div class="post-metadata">

**Author:** ![knolleary](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/knolleary/32/3_2.png) [@knolleary](https://discourse.nodered.org/u/knolleary)\
**Post date:** [17 September 2020 15:28 UTC](https://discourse.nodered.org/t/updating-nodes-background-color-depending-on-config/32841/5 "2020-09-17T15:28:20Z")

</div>

Regardless of the general merits, the fact remains that in the code today, it is _not_ possible to change the colour of a node via its configuration.

---

<div class="post-metadata">

**Author:** ![dceejay](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/dceejay/32/38_2.png) [@dceejay](https://discourse.nodered.org/u/dceejay)\
**Post date:** [17 September 2020 15:37 UTC](https://discourse.nodered.org/t/updating-nodes-background-color-depending-on-config/32841/6 "2020-09-17T15:37:24Z")

</div>

why not use one colour for all your nodes so they are all easily spotted, then different icons for the different types... ?

---

<div class="post-metadata">

**Author:** ![cinhcet](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/cinhcet/32/438_2.png) [@cinhcet](https://discourse.nodered.org/u/cinhcet)\
**Post date:** [17 September 2020 16:28 UTC](https://discourse.nodered.org/t/updating-nodes-background-color-depending-on-config/32841/7 "2020-09-17T16:28:29Z")

</div>

I think his point is that he has multiple different input nodes but only a single output node and he wants the output node to change its color to match the input node.

Workaround: Change the icon manually for the output node to match the input node

---

<div class="post-metadata">

**Author:** ![TotallyInformation](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/totallyinformation/32/31_2.png) [@TotallyInformation](https://discourse.nodered.org/u/TotallyInformation)\
**Post date:** [17 September 2020 17:12 UTC](https://discourse.nodered.org/t/updating-nodes-background-color-depending-on-config/32841/8 "2020-09-17T17:12:22Z")

</div>

> [@pitus](#):
>
> Note that the change doesn't happen at run-time but only at design time - exiting from the node editor should allow to set the color of the node in my opinion, it would be beneficial not just in my case.

Personally I've never seen a need for that but then my use cases are certainly limited.

Of course, you could always hack it.

All of the nodes are just defined in text so you could use a script to manipulate them. Of course, you'd have to redo it whenever one of the nodes was updated - but still. I'm not recommending that though, only mentioning it in case you feel strongly enough that the outcome warrants the hack.

---

<div class="post-metadata">

**Author:** ![pitus](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/pitus/32/28170_2.png) [@pitus](https://discourse.nodered.org/u/pitus)\
**Post date:** [18 September 2020 15:57 UTC](https://discourse.nodered.org/t/updating-nodes-background-color-depending-on-config/32841/9 "2020-09-18T15:57:48Z")

</div>

Nope, hacking the flow definition file makes no sense if it has to be redone each time...  
If anything, I was hoping to hack the objects already loaded into the node at run-time, but was unable to override any of the color properties successfully (with a visual effect).

I'll try the suggested change of the Icon instead of the background color, although I'm using an arrow to indicate an input node so changing it to something meaningful yet distinct for each type will be a challenge ☹

Is there any chance for this feature to be implemented in some near-future version? I can help with that as I had to get myself quite familiar with some of the NR code lately anyway...

---

<div class="post-metadata">

**Author:** ![dceejay](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/dceejay/32/38_2.png) [@dceejay](https://discourse.nodered.org/u/dceejay)\
**Post date:** [18 September 2020 19:44 UTC](https://discourse.nodered.org/t/updating-nodes-background-color-depending-on-config/32841/10 "2020-09-18T19:44:48Z")

</div>

Sorry - but for the reasons already cited we do not want to enable this. Certainly not in any short term plans.

---

<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:** [17 November 2020 19:44 UTC](https://discourse.nodered.org/t/updating-nodes-background-color-depending-on-config/32841/11 "2020-11-17T19:44:53Z")

</div>

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