# Chart text

**URL:** <https://community.fliplet.com/t/chart-text/106>\
**Category:** Get Help\
**Tags:** charts, text\
**Created:** [June 11, 2021, 12:36pm UTC](https://community.fliplet.com/t/chart-text/106 "2021-06-11T12:36:14Z")\
**Posts on this page:** 3\
**Page:** 1

<div class="post-metadata">

**Author:** ![Fran](https://avatars.discourse-cdn.com/v4/letter/f/a4c791/32.png) [@Fran](https://community.fliplet.com/u/Fran)\
**Post date:** [June 11, 2021, 12:36pm UTC](https://community.fliplet.com/t/chart-text/106/1 "2021-06-11T12:36:14Z")

</div>

I’d like to change the size and colour of the charts text. Would be great if I could get some CSS that would apply changes to all charts, not just individual components.

Thanks!

---

<div class="post-metadata">

**Author:** ![Deb](https://dub1.discourse-cdn.com/flex017/user_avatar/community.fliplet.com/deb/32/159_2.png) [@Deb](https://community.fliplet.com/u/Deb)\
**Post date:** [June 11, 2021, 12:50pm UTC](https://community.fliplet.com/t/chart-text/106/2 "2021-06-11T12:50:56Z")

</div>

Hi Fran,

You need to use this JavaScript snippet to change the text size and colour of the snippet. We cannot use CSS as this is a custom HighCharts component.

This snippet will work for all the charts on the page. Please add this to the screen JS in the developer options.

```auto
Fliplet.Hooks.on('beforeChartRender', function(options) {
  _.set(options.chartOptions.legend, 'itemStyle.fontSize', 25); //change 25 to the text size you need
  _.set(options.chartOptions.legend, 'itemStyle.color', '#eb4034!important'); //change '#eb4034' to the Hex colour of the legend text. 
});

```

Further details of the Legend customisations can be found here:  
[https://api.highcharts.com/highcharts/6.0.2/legend.itemStyle](https://api.highcharts.com/highcharts/6.0.2/legend.itemStyle)

---

<div class="post-metadata">

**Author:** ![Fran](https://avatars.discourse-cdn.com/v4/letter/f/a4c791/32.png) [@Fran](https://community.fliplet.com/u/Fran)\
**Post date:** [June 11, 2021, 12:55pm UTC](https://community.fliplet.com/t/chart-text/106/3 "2021-06-11T12:55:54Z")

</div>

Fab! Thank you
