Change the color of the charts

[Aramo]

Insert this code into Page Settings > Custom Code > Header field and replace BLOCKID with your block ID. Please note you need to check it with the published app; it will not show the changed color in preview or in Studio.

<script> 
window['BlockID-colors'] = ['#FE8070', '#DD7E6B'];
</script>

[nocodeking]

Thank you, works great!

[sisa]

Thanks for sharing @Aramo – and welcome to the community!

[piebru]

Hi everyone, I would like to know which custom code I should use to change the colors of the chart based on given values. For example, I would like to chart the goals based on the status (achieved, missed, in progress) of the goals. Thanks in advance

[javierlaborde]

Trying to achieve this in march 2025 but no success yet, i have two charts (a pie and a bar chart) inside of a column container, could that be interfering with the css?

[pford]

Hi @javierlaborde you can do this with new v5 charts using the code found in this doc. Note that this code is marginally supported and new charts are still a WIP: Custom Code Events and Style Selectors – Softr Help Docs

[dangreen20]

I changed the code, but it’s not changing my chart colors on any I have on this page. On this page, I do have 3 charts. I am not sure how I change the color code for just one of the charts on that page.