as an alternative to what pugazh suggested, you could do the following:

title: {
    verticalalign: 'middle',
    floating: true,
    text: "<span style='color: red; font: 15px arial;'><b>10%</b><br/>need action</span>"
    x: 0,
    y: -5, 
    usehtml: true

if you use the usehtml attribute, you can add simple markup to your title text. the highcharts span tags are notorious for swapping out values when the chart is rendered as an svg, which is why i added the styles as inline code vs. the style attribute in your original code.

just be mindful of your quotes here and escape any additional single or double quotes you need to use.


change the fill for the class .highcharts-title tspan. refer

add this style to your css

.highcharts-title tspan {
  fill: red;

Related Query

More Query from same tag