Sorry folks, I know I am kind of being stubborn. I looked at my previous post hoping it would help, but doesn't. I have a button (ui_template node) set up and it has a material design icon in it, but I'm wanting to change it as there is a new use for said button, and so it would be nice if the ico…

Based on conversations we had in 2022, I thought you were using iconify ? In any case why not make your life easy and just use text - <div id="GButtonM_BIL"> <md-button class="md-button program-names darkred"> <span style="font-size:24px;font-weight:bold;">$</span> <md-tooltip>B…

Does your previous post(s) not help? [image] Is anybody familiar with creating a weather api in node-red please share a example General I'm not sure if this is what you want/need but I wrote a weather display thing. You need open-weather (key needed) It is a…

It was another post I asked (and promptly solved myself that I was offered when I searched. Not the one you found. Gotta love searches.

After a bit of help from....... I got this code: <div id="GButtonM_BIL"> <md-button class="md-button program-names darkred"> <svg viewBox="0 0 24 24" style="width:24px;height:24px;fill:currentColor;"> <path d="M12 1C5.92 1 1 5.92 1 12S5.92 23 12 23 23 18.08 …

Are you sure you're editing the proper div? You might have some nested div that is overriding this image.

Sorry but I hope I'm not. All this is very new and I am only Doing what I'm told. I've since found out that that Big number is the SVG for the icon.

That big number looks exactly like the image you have in your button, so nothing is wrong except that you have the wrong "big number" :wink: Where did you get it from, I suspect you clicked the wrong icon ? Change the path part as follows <path d="M441-120v-86q-53-12-91.5-46T293-348l74-30q15 4…

[image] Sean-McG: Where did you get it from No, that was ChatGPT's effort. Thanks I'll give it a try. Sorry, doesn't work. Blank button. :frowning: <div id="GButtonM_BIL"> <md-button class="md-button program-names darkred"> <svg viewBox="0 0 24 24" style="width:24px;height:24…

Sean, I possibly am. Alas I don't remember that long ago. :crying_cat: I searched the web, got help from ..... GPT and that is where it took me. I was wanting that solution - the one you posted - but wasn't sure on the structure. I'll try it now. IT WORKS (Of course it does.) So (I'm still …

[image] Trying_to_learn: mdiCurrencyUsd The actual name of the icon is mdi-currency-usd

Ok, I stand corrected. But I can't even find that in the code, so as much as it is true: it doesn't help me understand how it works in the bigger picture.

Node-RED

Node-RED Forum

Help with icons (Material design)

General

Steve-Mcl 21 October 2025 14:15 2

Does your previous post(s) not help?

The flow in this post has elements with material icons in!

Topic		Replies	Views
Help with icon in `text` node Dashboard	12	4488	31 October 2020
Material Design Icons Dashboard	5	7688	5 November 2020
Material design icon in `button` node Dashboard	1	1359	8 September 2019
Material design icons vs font awesome Dashboard	45	12529	9 July 2019
Size of Material-Icon (node-text) Dashboard	9	2069	20 January 2021

Copyright OpenJS Foundation and Node-RED contributors. All rights reserved. The OpenJS Foundation has registered trademarks and uses trademarks. For a list of trademarks of the OpenJS Foundation, please see our Trademark Policy and Trademark List. Trademarks and logos not indicated on the list of OpenJS Foundation trademarks are trademarks™ or registered® trademarks of their respective holders. Use of them does not imply any affiliation with or endorsement by them.

Help with icons (Material design)

Related topics