diff --git a/packages/main/src/ProgressIndicator.hbs b/packages/main/src/ProgressIndicator.hbs
index 5e45964ae938..24b2eef6fc73 100644
--- a/packages/main/src/ProgressIndicator.hbs
+++ b/packages/main/src/ProgressIndicator.hbs
@@ -7,7 +7,7 @@
      aria-disabled="{{_ariaDisabled}}"
      aria-label="{{accessibleName}}"
 >
-    <div class="ui5-progress-indicator-bar" style="{{styles.bar}}">
+    <div class="ui5-progress-indicator-bar" part="bar" style="{{styles.bar}}">
         {{#unless showValueInRemainingBar}}
            {{> valueLabel}}
         {{/unless}}
diff --git a/packages/main/src/ProgressIndicator.ts b/packages/main/src/ProgressIndicator.ts
index 6702ba8df328..32131fc0205a 100644
--- a/packages/main/src/ProgressIndicator.ts
+++ b/packages/main/src/ProgressIndicator.ts
@@ -35,6 +35,7 @@ import ProgressIndicatorCss from "./generated/themes/ProgressIndicator.css.js";
  * ### ES6 Module Import
  *
  * `import "@ui5/webcomponents/dist/ProgressIndicator.js";`
+ * @csspart bar - Used to style the main bar of the `ui5-progress-indicator`
  * @csspart remaining-bar - Used to style the remaining bar of the `ui5-progress-indicator`
  * @constructor
  * @extends UI5Element
diff --git a/packages/main/test/pages/ProgressIndicator.html b/packages/main/test/pages/ProgressIndicator.html
index ff5561777ca3..ad319ecbdab7 100644
--- a/packages/main/test/pages/ProgressIndicator.html
+++ b/packages/main/test/pages/ProgressIndicator.html
@@ -104,6 +104,10 @@
 	<br />
 	<ui5-progress-indicator value="25" class="progressindicator2auto"></ui5-progress-indicator>
 	<br />
+	Custom Color
+	<br />
+	<ui5-progress-indicator value="25" class="progressindicator3auto"></ui5-progress-indicator>
+	<br />
 	Test progress indicator
 	<br />
 	<ui5-progress-indicator id="test-progress-indicator"></ui5-progress-indicator>
diff --git a/packages/main/test/pages/styles/ProgressIndicator.css b/packages/main/test/pages/styles/ProgressIndicator.css
index 56a59d5f89af..b20db939c039 100644
--- a/packages/main/test/pages/styles/ProgressIndicator.css
+++ b/packages/main/test/pages/styles/ProgressIndicator.css
@@ -6,3 +6,12 @@
     height: 50px;
     width: 200px;
 }
+
+.progressindicator3auto::part(bar),
+.progressindicator3auto::part(remaining-bar)::after {
+    background-color: rgb(255, 0, 0);
+}
+
+.progressindicator3auto::part(remaining-bar) {
+    background-color: rgb(255, 225, 225);
+}