diff --git a/packages/material-ui/src/Button/Button.js b/packages/material-ui/src/Button/Button.js
index dc86a2b18ff53e..2e607fb5fa9a50 100644
--- a/packages/material-ui/src/Button/Button.js
+++ b/packages/material-ui/src/Button/Button.js
@@ -84,7 +84,7 @@ const ButtonRoot = styled(ButtonBase, {
         duration: theme.transitions.duration.short,
       },
     ),
-    '&:hover': {
+    '&:hover': !styleProps.disabled && {
       textDecoration: 'none',
       backgroundColor: alpha(theme.palette.text.primary, theme.palette.action.hoverOpacity),
       // Reset on touch devices, it doesn't add specificity
diff --git a/test/regressions/fixtures/Button/DisabledButtons.js b/test/regressions/fixtures/Button/DisabledButtons.js
new file mode 100644
index 00000000000000..47564f94fad649
--- /dev/null
+++ b/test/regressions/fixtures/Button/DisabledButtons.js
@@ -0,0 +1,14 @@
+import * as React from 'react';
+import Button from '@material-ui/core/Button';
+
+export default function Demo() {
+  return (
+    <React.Fragment>
+      <Button disabled style={{ pointerEvents: 'all' }}>
+        disabled with pointer-events
+      </Button>
+      <Button disabled>disabled without pointer-events</Button>
+      <Button aria-disabled>aria-disabled</Button>
+    </React.Fragment>
+  );
+}
diff --git a/test/regressions/index.test.js b/test/regressions/index.test.js
index b15cc2e3c75475..09927f63aded3e 100644
--- a/test/regressions/index.test.js
+++ b/test/regressions/index.test.js
@@ -89,6 +89,21 @@ async function main() {
       });
     });
 
+    describe('<Button />', () => {
+      it('hover styles on disabled buttons', async () => {
+        const index = routes.findIndex((route) => route === '/regression-Button/DisabledButtons');
+        const testcase = await renderFixture(index);
+
+        // force: true so that pointer-events, layout etc is ignored
+        await page.hover('button:nth-of-type(1)', { force: true });
+        await takeScreenshot({ testcase, route: '/regression-Button/DisabledButtons-hover1' });
+        await page.hover('button:nth-of-type(2)', { force: true });
+        await takeScreenshot({ testcase, route: '/regression-Button/DisabledButtons-hover2' });
+        await page.hover('button:nth-of-type(3)', { force: true });
+        await takeScreenshot({ testcase, route: '/regression-Button/DisabledButtons-hover3' });
+      });
+    });
+
     describe('Rating', () => {
       it('should handle focus-visible correctly', async () => {
         const index = routes.findIndex(