# Change color of chart legend/axis and grid (Legacy Dashboard)

**URL:** <https://discourse.nodered.org/t/change-color-of-chart-legend-axis-and-grid-legacy-dashboard/87937>\
**Category:** Dashboard\
**Tags:** node-red-dashboard, chart\
**Created:** [14 May 2024 08:56 UTC](https://discourse.nodered.org/t/change-color-of-chart-legend-axis-and-grid-legacy-dashboard/87937 "2024-05-14T08:56:02Z")\
**Posts on this page:** 3\
**Page:** 1

<div class="post-metadata">

**Author:** ![lori](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/lori/32/85597_2.png) [@lori](https://discourse.nodered.org/u/lori)\
**Post date:** [14 May 2024 08:56 UTC](https://discourse.nodered.org/t/change-color-of-chart-legend-axis-and-grid-legacy-dashboard/87937/1 "2024-05-14T08:56:02Z")

</div>

Hello,

I want to change the color of the chart labels on x/y axis (in my case from black to white) as well as the grid lines.

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

It might be possible through passing in a config json object, however I haven't found any documentation for that. I have found [that post](https://discourse.nodered.org/t/dashboard-ui-chart-legend-font-color/48898) where it seems that a `msg.ui_control` is set to a complete chart config json.

Has anybody I minimal example of how to change at least the color of the labels on the x/y axis? Changing the grid line color is useful as well.

---

<div class="post-metadata">

**Author:** ![lori](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/lori/32/85597_2.png) [@lori](https://discourse.nodered.org/u/lori)\
**Post date:** [14 May 2024 18:50 UTC](https://discourse.nodered.org/t/change-color-of-chart-legend-axis-and-grid-legacy-dashboard/87937/2 "2024-05-14T18:50:21Z")

</div>

Setting up the config via json through `ui_control` worked!

```java
msg.ui_control = { 
    options: {
        scales: {
            xAxes: [{                
                gridLines: {
                    display: true,
                    color:'transparent',
                    zeroLineColor: 'white'
                },
                type: 'time',
                ticks: {
                    fontColor: 'white'
                }
            }],
            yAxes: [{
                gridLines:{
                    display: true,
                    color:'transparent',
                    zeroLineColor: 'white'
                },
                ticks: {
                    fontColor:'white'
                }
            }]
        }
    }
}
return msg; 

```

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

---

<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:** [28 May 2024 18:50 UTC](https://discourse.nodered.org/t/change-color-of-chart-legend-axis-and-grid-legacy-dashboard/87937/3 "2024-05-28T18:50:24Z")

</div>

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