Color Ranges

The ArcGauge enables you to set different colors depending on the current value.

To configure the range colors, set the colors option.

$("#gauge").kendoArcGauge({
    value: 30,
    colors: [{
        to: 25,
        color: '#0058e9'
    }, {
        from: 25,
        to: 50,
        color: '#37b400'
    }, {
        from: 50,
        to: 75,
        color: '#ffc000'
    }, {
        from: 75,
        color: '#f31700'
    }]
});