# Custom Nodes Appearance

**URL:** <https://discourse.nodered.org/t/custom-nodes-appearance/81600>\
**Category:** Developing Nodes\
**Created:** [27 September 2023 04:01 UTC](https://discourse.nodered.org/t/custom-nodes-appearance/81600 "2023-09-27T04:01:01Z")\
**Posts on this page:** 5\
**Page:** 1

<div class="post-metadata">

**Author:** ![Khk2000](https://avatars.discourse-cdn.com/v4/letter/k/278dde/32.png) [@Khk2000](https://discourse.nodered.org/u/Khk2000)\
**Post date:** [27 September 2023 04:01 UTC](https://discourse.nodered.org/t/custom-nodes-appearance/81600/1 "2023-09-27T04:01:01Z")

</div>

I am beginner to node-red tool, I have created few custom nodes, how do I change the shape and styling of those nodes, I tried to add few css styling inside node html file, but it was not reflecting

Any detailed guidance on this would be highly appreciated

---

<div class="post-metadata">

**Author:** ![ralphwetzel](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/ralphwetzel/32/53713_2.png) [@ralphwetzel](https://discourse.nodered.org/u/ralphwetzel)\
**Post date:** [27 September 2023 07:40 UTC](https://discourse.nodered.org/t/custom-nodes-appearance/81600/2 "2023-09-27T07:40:37Z")

</div>

Hi @Khk2000

Please don't multi-post topics in this forum.  
I tried to give an explanaition in the other thread:

> [@Change layout of the custom nodes](https://discourse.nodered.org/t/change-layout-of-the-custom-nodes/14692/4):
>
> Despite you put yourself on a thread that is years old, I'll try to give an explanation: The posts you linked refer to the visual representation of data on the [Node-RED dashboard](https://flows.nodered.org/node/node-red-dashboard). The dashboard is kind of a "standard" web page, powered by NR flows. The elements on this page can be customized "as you like". The posts you link give you some examples of what's possible. The look of a node in the NR editor yet is standardized. You may alter some properties (like it's color), but the editor defines…

The short answer is: There's no interface / functionality that offers you to change the shape and styling of a node in the workspace.

---

<div class="post-metadata">

**Author:** ![Khk2000](https://avatars.discourse-cdn.com/v4/letter/k/278dde/32.png) [@Khk2000](https://discourse.nodered.org/u/Khk2000)\
**Post date:** [27 September 2023 10:25 UTC](https://discourse.nodered.org/t/custom-nodes-appearance/81600/3 "2023-09-27T10:25:46Z")

</div>

If I wish to change icon of custom nodes other than those provided by node-red, my own icon, after following documentation, it says to place the icon.svg or icon.png inside icons folder which I found inside node-red/packages/node\_modules/...../icons/  
But this path seems to be generated one and can't be included inside code changes,  
Is there someother way we can include this in, so our node display my icon

---

<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:** [27 September 2023 11:11 UTC](https://discourse.nodered.org/t/custom-nodes-appearance/81600/4 "2023-09-27T11:11:10Z")

</div>

> [@Khk2000](#):
>
> it says to place the icon.svg or icon.png inside icons folder

Create an `icons` folder in your own node package next to the `.html` and `.js` files.

---

<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:** [26 November 2023 11:11 UTC](https://discourse.nodered.org/t/custom-nodes-appearance/81600/5 "2023-11-26T11:11:38Z")

</div>

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