diff --git a/src/lib/progress-bar/_progress-bar-theme.scss b/src/lib/progress-bar/_progress-bar-theme.scss
index d90d7d894cd..3f909865e65 100644
--- a/src/lib/progress-bar/_progress-bar-theme.scss
+++ b/src/lib/progress-bar/_progress-bar-theme.scss
@@ -8,7 +8,7 @@
   $warn: map-get($theme, warn);
 
   .mat-progress-bar-background {
-    background: #{_mat-progress-bar-buffer($primary, lighter)};
+    background-image: #{_mat-progress-bar-buffer($primary, lighter)};
   }
 
   .mat-progress-bar-buffer {
@@ -21,12 +21,13 @@
 
   .mat-progress-bar.mat-accent {
     .mat-progress-bar-background {
-      background: #{_mat-progress-bar-buffer($accent, lighter)};
+      background-image: #{_mat-progress-bar-buffer($accent, lighter)};
     }
 
     .mat-progress-bar-buffer {
       background-color: mat-color($accent, lighter);
     }
+
     .mat-progress-bar-fill::after {
       background-color: mat-color($accent);
     }
@@ -34,12 +35,13 @@
 
   .mat-progress-bar.mat-warn {
     .mat-progress-bar-background {
-      background: #{_mat-progress-bar-buffer($warn, lighter)};
+      background-image: #{_mat-progress-bar-buffer($warn, lighter)};
     }
 
     .mat-progress-bar-buffer {
       background-color: mat-color($warn, lighter);
     }
+
     .mat-progress-bar-fill::after {
       background-color: mat-color($warn);
     }