# Dashboard2/Vuetify/Icons How to use?

**URL:** <https://discourse.nodered.org/t/dashboard2-vuetify-icons-how-to-use/95892>\
**Category:** Dashboard\
**Tags:** dashboard-2\
**Created:** [9 March 2025 22:33 UTC](https://discourse.nodered.org/t/dashboard2-vuetify-icons-how-to-use/95892 "2025-03-09T22:33:36Z")\
**Posts on this page:** 3\
**Page:** 1

<div class="post-metadata">

**Author:** ![gNeandr](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/gneandr/32/73947_2.png) [@gNeandr](https://discourse.nodered.org/u/gNeandr)\
**Post date:** [9 March 2025 22:33 UTC](https://discourse.nodered.org/t/dashboard2-vuetify-icons-how-to-use/95892/1 "2025-03-09T22:33:36Z")

</div>

With Dashboard2, I'm trying to use buttons/icons based on Vuetify -- with moderate success.  
For example, this works:

```auto
          <span style="margin-left:10px">          
            <v-icon style="cursor:pointer" 
              color="indigo-darken-4" @click="rSelect(3)">
              mdi-cached
            </v-icon>
          </span>

```

But these examples don't work at all:

```auto
  <span style="margin-left:10px">
    <v-icon icon="fas fa-plus" /> <!-- This renders a FontAwesome icon -->
    <v-icon icon="mdi:mdi-minus" /> <!-- This renders a MDI icon -->
  </span>

```

Unfortunately I can't find any further information specifically for the correct handling of NodeRed / Vueitfy to be able to use the different buttons and icons.  
Is there a good manual for this? !

Help/links are very welcome

---

<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:** [11 March 2025 14:36 UTC](https://discourse.nodered.org/t/dashboard2-vuetify-icons-how-to-use/95892/2 "2025-03-11T14:36:56Z")

</div>

> [@gNeandr](#):
>
> `<v-icon icon="fas fa-plus" /> `

Dashboard does not have any resources baked in for font awesome icons.

> [@gNeandr](#):
>
> ` <v-icon icon="mdi:mdi-minus" />`

This is just wrong syntax.

There are ways to bring in other icons than [mdi](https://pictogrammers.com/library/mdi/). I think easiest will be to use svg.

---

<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:** [10 April 2025 14:37 UTC](https://discourse.nodered.org/t/dashboard2-vuetify-icons-how-to-use/95892/3 "2025-04-10T14:37:18Z")

</div>

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