It would be nice if there was a property on the TelerikProgressBar to change the color of the bar.   You can modify it now, however its not intuitive.

Use Case:

I have a grid showing data on projects.

  I want to show the %complete of a project using a progress bar and want to conditionally change the color of the bar based on % complete and time left.

Current Process

You can modify the color of the bar by setting the Class on the bar and adding a selector for the class .k-state-selected

<TelerikProgressBar Class='bg-green' Max="1" Value="(double)value" >

  .bg-green {
    }

    .bg-green .k-state-selected  {
    background-color: green;
    }

=====ADMIN EDIT=====

Here is an example of the desired result in another component you can use as a reference: https://demos.telerik.com/kendo-ui/arc-gauge/colors.