# Dashboard 2.0 Project - Live Demo Dashboard

**URL:** <https://discourse.nodered.org/t/dashboard-2-0-project-live-demo-dashboard/90147>\
**Category:** Share Your Projects\
**Tags:** flowfuse, dashboard-2\
**Created:** [13 August 2024 08:20 UTC](https://discourse.nodered.org/t/dashboard-2-0-project-live-demo-dashboard/90147 "2024-08-13T08:20:51Z")\
**Posts on this page:** 8\
**Page:** 1

<div class="post-metadata">

**Author:** ![joepavitt](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/joepavitt/32/59722_2.png) [@joepavitt](https://discourse.nodered.org/u/joepavitt)\
**Post date:** [13 August 2024 08:20 UTC](https://discourse.nodered.org/t/dashboard-2-0-project-live-demo-dashboard/90147/1 "2024-08-13T08:20:51Z")

</div>

Hi All, wanted to make you aware of a new asset we've made available: [Dashboard 2.0 Interactive Docs](https://dashboard-demos.flowfuse.cloud/dashboard/charts-example)

 ![Screenshot 2024-08-13 at 09.20.16](https://us1.discourse-cdn.com/flex026/uploads/nodered/original/3X/1/e/1e7c4cdc7db950b91a209232f500bceff0b449ef.png)

On this Dashboard you'll find interactive examples for all of our published widgets, with example flows, and a bit of help documentation too.

You can also navigate to these interactive demos from our documentation from the new "Try Demo" buttons:

 ![Screenshot 2024-08-13 at 09.19.24](https://us1.discourse-cdn.com/flex026/uploads/nodered/original/3X/8/3/831aa7e2ee64b1bf326f4b848bec96a0feffe244.png)

Thanks to @gayanSandamal for his work on the interactive docs!

---

<div class="post-metadata">

**Author:** ![zenofmud](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/zenofmud/32/316_2.png) [@zenofmud](https://discourse.nodered.org/u/zenofmud)\
**Post date:** [13 August 2024 10:00 UTC](https://discourse.nodered.org/t/dashboard-2-0-project-live-demo-dashboard/90147/2 "2024-08-13T10:00:45Z")

</div>

The bar chart example threw me for a bit because it looked like when you used a slider it would change the bar associated with it, then start changing the other bar.

I finally realized that what was changing is the scale of the graph as the value goes up and down.

---

<div class="post-metadata">

**Author:** ![joepavitt](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/joepavitt/32/59722_2.png) [@joepavitt](https://discourse.nodered.org/u/joepavitt)\
**Post date:** [13 August 2024 10:45 UTC](https://discourse.nodered.org/t/dashboard-2-0-project-live-demo-dashboard/90147/3 "2024-08-13T10:45:15Z")

</div>

> [@zenofmud](#):
>
> I finally realized that what was changing is the scale of the graph as the value goes up and down.

Good point - @gayanSandamal maybe worth setting `yMax` on those charts to alleviate this?

---

<div class="post-metadata">

**Author:** ![gayanSandamal](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/gayansandamal/32/93024_2.png) [@gayanSandamal](https://discourse.nodered.org/u/gayanSandamal)\
**Post date:** [13 August 2024 11:19 UTC](https://discourse.nodered.org/t/dashboard-2-0-project-live-demo-dashboard/90147/4 "2024-08-13T11:19:22Z")

</div>

Yes, setting a max y will helps this. I will have a look on this

---

<div class="post-metadata">

**Author:** ![mudwalker](https://avatars.discourse-cdn.com/v4/letter/m/47e85d/32.png) [@mudwalker](https://discourse.nodered.org/u/mudwalker)\
**Post date:** [13 August 2024 12:46 UTC](https://discourse.nodered.org/t/dashboard-2-0-project-live-demo-dashboard/90147/5 "2024-08-13T12:46:48Z")

</div>

Welcome @gayanSandamal and a nice Documentation/Examples.

One question I do have, is it possible to change the colour of a button yet so that we can indicate it's state (say On/Green or Off/Red)?

---

<div class="post-metadata">

**Author:** ![joepavitt](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/joepavitt/32/59722_2.png) [@joepavitt](https://discourse.nodered.org/u/joepavitt)\
**Post date:** [13 August 2024 13:54 UTC](https://discourse.nodered.org/t/dashboard-2-0-project-live-demo-dashboard/90147/6 "2024-08-13T13:54:19Z")

</div>

> [@mudwalker](#):
>
> One question I do have, is it possible to change the colour of a button yet so that we can indicate it's state (say On/Green or Off/Red)?

It certainly is: [Button ui-button | Node-RED Dashboard 2.0](https://dashboard.flowfuse.com/nodes/widgets/ui-button.html#dynamic-properties)

---

<div class="post-metadata">

**Author:** ![mudwalker](https://avatars.discourse-cdn.com/v4/letter/m/47e85d/32.png) [@mudwalker](https://discourse.nodered.org/u/mudwalker)\
**Post date:** [13 August 2024 14:12 UTC](https://discourse.nodered.org/t/dashboard-2-0-project-live-demo-dashboard/90147/7 "2024-08-13T14:12:54Z")

</div>

Thank you, last time I looked that property wasn't available.

---

<div class="post-metadata">

**Author:** ![gayanSandamal](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/gayansandamal/32/93024_2.png) [@gayanSandamal](https://discourse.nodered.org/u/gayanSandamal)\
**Post date:** [13 August 2024 17:49 UTC](https://discourse.nodered.org/t/dashboard-2-0-project-live-demo-dashboard/90147/8 "2024-08-13T17:49:16Z")

</div>

@mudwalker , thank you and sorry for the late reply. As @joepavitt mentioned, you can set the button background, text, and icon colors using RGB, HEX, or any other colour format. I hope the Dashboard 2.0 documentation helps with that.
