# Changing node icons based on configuration

**URL:** https://discourse.nodered.org/t/changing-node-icons-based-on-configuration/82280
**Category:** Feature Requests
**Created:** [23 October 2023 11:43 UTC](https://discourse.nodered.org/t/changing-node-icons-based-on-configuration/82280 "2023-10-23T11:43:34Z")
**Posts on this page:** 6
**Page:** 1

<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: [23 October 2023 11:43 UTC](https://discourse.nodered.org/t/changing-node-icons-based-on-configuration/82280/1 "2023-10-23T11:43:34Z")

</div>

I have been asked by a client if it is possible to make the node icon settable based on a configuration variable... so more dynamic (but only at edit/config time)... Currently we can set the icon based on a function - so it is partly do-able - but only to select within the icons installed - or fa-icons - or fixed ones supplied within an /icons directory... Want we want to do is to be able to generate them (svg) dynamically from a library so there are no pre computed icons.

Having looked at the code I can think of 2 ways to achieve this (so far) ...

1. allow the node to dynamically create a {mynode}/icons endpoint - but the code does too many physical checks for the existence of the actual icon file to make this feasible.
2. add a check for if the icon is specified as http(s)://... and allow loading from a more general endpoint - but this then could open up a code injection point.

Anyone have any thoughts how this could be achieved ? (such that I could prototype a PR... )

Thanks

---

<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: [23 October 2023 11:47 UTC](https://discourse.nodered.org/t/changing-node-icons-based-on-configuration/82280/2 "2023-10-23T11:47:23Z")

</div>

Is it not possible to return a data Uri Dave?

```auto
return 'data:image/svg+xml;utf8,<svg ... > ... </svg>'

```

Obviously the SVG part would be computed. Could even be base64 encoded

---

<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: [23 October 2023 11:54 UTC](https://discourse.nodered.org/t/changing-node-icons-based-on-configuration/82280/3 "2023-10-23T11:54:17Z")

</div>

i don't think so - as it keeps checking 'function isIconExists(iconPath) {...'  
but you're right - if it did just accept svg that would also be another way... though all these would be hard to contain/force fit to 40px wide 🙂

---

<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: [23 October 2023 15:51 UTC](https://discourse.nodered.org/t/changing-node-icons-based-on-configuration/82280/4 "2023-10-23T15:51:57Z")

</div>

I have found a way to use the admin endpoint technique we use to let config panels get data from the backend, be used to return the svgs I need. BUT it requires that the existing icon node allow trying the fetch them from this endpoint... To try to restrict that somewhat I am thinking of using a regex to ensure the uri is of a specific form - but is that overkill ?

I'm thinking of something like `RegExp("^\/"+node.type+"\/icon\/.*\.svg$","i");`  
which means the endpoint must contain the node type /icon/.... and end .svg

I think it probably needs to contain node.type as the icon code in the core doesn't actually know anything else about the calling node, or is this just overkill for something already hanging off the admin api root ? IF this is roughly ok I'll propose a PR.

---

<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: [23 October 2023 19:42 UTC](https://discourse.nodered.org/t/changing-node-icons-based-on-configuration/82280/5 "2023-10-23T19:42:11Z")

</div>

Pull Request raised here - [let icons be settable by loading from server endpoint by dceejay · Pull Request #4391 · node-red/node-red · GitHub](https://github.com/node-red/node-red/pull/4391)

---

<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: [22 December 2023 19:42 UTC](https://discourse.nodered.org/t/changing-node-icons-based-on-configuration/82280/6 "2023-12-22T19:42:20Z")

</div>

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