<div id="progressbar"></div>
<script>
 $("#progressbar").kendoCircularProgressBar({
    value: 60,
    colors: [{
        from: 0,
        to: 30,
        color: '#e74c3c'
    }, {
        from: 30,
        to: 70,
        color: '#f39c12'
    }, {
        from: 70,
        to: 100,
        color: '#2ecc71'
    }]
 });
</script>