diff --git a/src/lib/progress-bar/progress-bar.html b/src/lib/progress-bar/progress-bar.html
index 632e741a1151..b4e66c5b6575 100644
--- a/src/lib/progress-bar/progress-bar.html
+++ b/src/lib/progress-bar/progress-bar.html
@@ -2,7 +2,7 @@
   The background div is named as such because it appears below the other divs and is not sized based
   on values.
 -->
-<svg width="100%" height="5" class="mat-progress-bar-background mat-progress-bar-element">
+<svg width="100%" height="5" focusable="false" class="mat-progress-bar-background mat-progress-bar-element">
   <defs>
     <pattern [id]="progressbarId" x="5" y="0" width="10" height="5" patternUnits="userSpaceOnUse">
       <circle cx="2.5" cy="2.5" r="2.5"/>
diff --git a/src/lib/progress-bar/progress-bar.spec.ts b/src/lib/progress-bar/progress-bar.spec.ts
index be8337dcbd14..b5b0a6dde230 100644
--- a/src/lib/progress-bar/progress-bar.spec.ts
+++ b/src/lib/progress-bar/progress-bar.spec.ts
@@ -87,6 +87,11 @@ describe('MatProgressBar', () => {
       expect(progressComponent._primaryTransform()).toEqual({transform: 'scaleX(0.6)'});
       expect(progressComponent._bufferTransform()).toEqual({transform: 'scaleX(0.6)'});
     });
+
+    it('should not be able to tab into the underlying SVG element', () => {
+      const svg = fixture.debugElement.query(By.css('svg')).nativeElement;
+      expect(svg.getAttribute('focusable')).toBe('false');
+    });
   });
 
   describe('buffer progress-bar', () => {