[Solved]-How to accomplish responsive texts in Highcharts gauges?-Highcharts

You could update dataLabel for gauge series and use inline CSS to set font-size per each text line based on current chart width.

Demo: https://jsfiddle.net/sxkz9q32/

Relevant part of code:

  var options = {
    tooltip: {
      enabled: false
    },
    chart: {
      type: 'gauge',
      backgroundColor: 'rgba(255, 255, 255, 0)',
      plotBackgroundColor: null,
      plotBackgroundImage: null,
      plotBorderWidth: 0,
      plotShadow: false,
      spacing: [5, 30, 5, 30],
      style: {
        fontSize: '1em'
      },
      events: {
        redraw: function() {
          var chart = this;
          if (chart.lastWidth !== chart.plotWidth) {
            chart.lastWidth = chart.plotWidth;
            chart.series[0].update({ //apply changes to center the text
              dataLabels: {
                formatter: function() {
                  var output = '<div class="gauge-data">';
                  output += '<span class="gauge-value" style="font-size: ' + chart.plotWidth / 66 + 'em;">' + this.y + '</span>';
                  output += '<span class="gauge-text" style="font-size: ' + chart.plotWidth / 190 + 'em;">Engine LOAD</span>';
                  output += '<span class="gauge-unit" style="font-size: ' + chart.plotWidth / 211 + 'em;">KW</span>';
                  output += '</div>';

                  return output;
                }
              }
            }); 
          }
        }
      }
    },

I have used values based on width that were looking fine for me, but could use your own calculations.