# Can I add a icon to my dashboard group node

**URL:** <https://discourse.nodered.org/t/can-i-add-a-icon-to-my-dashboard-group-node/71291>\
**Category:** Dashboard\
**Created:** [26 November 2022 16:07 UTC](https://discourse.nodered.org/t/can-i-add-a-icon-to-my-dashboard-group-node/71291 "2022-11-26T16:07:34Z")\
**Posts on this page:** 8\
**Page:** 1

<div class="post-metadata">

**Author:** ![Mikee1234K](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/mikee1234k/32/70283_2.png) [@Mikee1234K](https://discourse.nodered.org/u/Mikee1234K)\
**Post date:** [26 November 2022 16:07 UTC](https://discourse.nodered.org/t/can-i-add-a-icon-to-my-dashboard-group-node/71291/1 "2022-11-26T16:07:34Z")

</div>

I have a dashboard group node with a name Birthdays. I have found a material icon for a birthday cake (cake). It should be used as mi-cake I believe. I found a post where you can add this to a label to display a icon. . In the group node there is no tab for icon, just class. I tried entering it into class but that does not no anything. I want to end up with the group name dispayed with the cake icon then Birthdays

 ![image](https://us1.discourse-cdn.com/flex026/uploads/nodered/original/3X/6/e/6e478d01a9934c5b1e24cec12b0628d379ccd7eb.png)

 ![image](https://us1.discourse-cdn.com/flex026/uploads/nodered/original/3X/0/9/09312f0a009ca2326dd872ad5b96d12b1688c583.png)

---

<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:** [26 November 2022 17:11 UTC](https://discourse.nodered.org/t/can-i-add-a-icon-to-my-dashboard-group-node/71291/2 "2022-11-26T17:11:25Z")

</div>

Add custom class to the group node

 ![image](https://us1.discourse-cdn.com/flex026/uploads/nodered/original/3X/5/0/504104e9b616eeb3425b818ee4679d451a203cd2.png)

And then make use of it as for after element of the paragraph inside it.

 ![image](https://us1.discourse-cdn.com/flex026/uploads/nodered/original/3X/b/b/bb98cd67b1fc2a53e19dc56a0608042305e0a400.png)

---

<div class="post-metadata">

**Author:** ![Mikee1234K](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/mikee1234k/32/70283_2.png) [@Mikee1234K](https://discourse.nodered.org/u/Mikee1234K)\
**Post date:** [26 November 2022 17:50 UTC](https://discourse.nodered.org/t/can-i-add-a-icon-to-my-dashboard-group-node/71291/3 "2022-11-26T17:50:09Z")

</div>

I have got my cake... but I have a couple more than I wanted

![image](https://us1.discourse-cdn.com/flex026/uploads/nodered/original/3X/0/5/05353b43c078b4966fcd9221a81149b985a978a2.png)

---

<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:** [26 November 2022 17:54 UTC](https://discourse.nodered.org/t/can-i-add-a-icon-to-my-dashboard-group-node/71291/4 "2022-11-26T17:54:14Z")

</div>

There's no such thing as too much Cake 🍰

The rule must be targeted to be more specific so it applies to to paragraph only inside the header.  
Maybe then like this:

```auto
 .group-icon-cake p.nr-dashboard-cardtitle::after {

```

---

<div class="post-metadata">

**Author:** ![Mikee1234K](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/mikee1234k/32/70283_2.png) [@Mikee1234K](https://discourse.nodered.org/u/Mikee1234K)\
**Post date:** [26 November 2022 19:41 UTC](https://discourse.nodered.org/t/can-i-add-a-icon-to-my-dashboard-group-node/71291/5 "2022-11-26T19:41:47Z")

</div>

> [@hotNipi](#):
>
> `.group-icon-cake p.nr-dashboard-cardtitle::after`

I agree one cannot have enough cake 😀 but in this case...  
the cakes are still there

I just checked, the dashboard text node class field is empty, so its not that

In case I made a mistake typing

```auto
<style>
    .group-icon-cake p.nr-dashboard-cardtitle::after {
       content:"\e7e9";
       font-family: 'Material Icons';
       font-weight: normal;
       font-style: normal;
       font-size: 24px;
       display: inline-block;
       line-height: 1;
       text-transform: none;
       letter-spacing: normal;
       word-wrap: normal;
       white-space: nowrap;
       }
       </style>

```

---

<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:** [26 November 2022 19:47 UTC](https://discourse.nodered.org/t/can-i-add-a-icon-to-my-dashboard-group-node/71291/6 "2022-11-26T19:47:16Z")

</div>

Just use developer tools and try to figure out from where it comes.  
I can't do blind debugging.

---

<div class="post-metadata">

**Author:** ![Mikee1234K](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/mikee1234k/32/70283_2.png) [@Mikee1234K](https://discourse.nodered.org/u/Mikee1234K)\
**Post date:** [26 November 2022 19:54 UTC](https://discourse.nodered.org/t/can-i-add-a-icon-to-my-dashboard-group-node/71291/7 "2022-11-26T19:54:34Z")

</div>

Not sure how I'd go about it. I'l focus on other projects I have with my dashboard, still plenty to do. This is low priority, its a nice to have so I'll come back to that later. By that time I should have picked up some more knowledge, I have picked up a lot lately and still adding every day.

---

<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 December 2022 19:55 UTC](https://discourse.nodered.org/t/can-i-add-a-icon-to-my-dashboard-group-node/71291/8 "2022-12-26T19:55:28Z")

</div>

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