diff --git a/docs/src/pages/customization/themes/OverridesCss.js b/docs/src/pages/customization/themes/OverridesCss.js
index baa83230c1c7a5..7487fa88c935f2 100644
--- a/docs/src/pages/customization/themes/OverridesCss.js
+++ b/docs/src/pages/customization/themes/OverridesCss.js
@@ -7,7 +7,7 @@ const theme = createMuiTheme({
     // Name of the component ⚛️ / style sheet
     MuiButton: {
       // Name of the rule
-      root: {
+      text: {
         // Some CSS
         background: 'linear-gradient(45deg, #FE6B8B 30%, #FF8E53 90%)',
         borderRadius: 3,
diff --git a/docs/src/pages/customization/themes/themes.md b/docs/src/pages/customization/themes/themes.md
index a883c7e12cbced..17cd9998b03a2e 100644
--- a/docs/src/pages/customization/themes/themes.md
+++ b/docs/src/pages/customization/themes/themes.md
@@ -314,7 +314,7 @@ That's a really powerful feature.
 const theme = createMuiTheme({
   overrides: {
     MuiButton: { // Name of the component ⚛️ / style sheet
-      root: { // Name of the rule
+      text: { // Name of the rule
         color: 'white', // Some CSS
       },
     },
diff --git a/packages/material-ui/src/Button/Button.js b/packages/material-ui/src/Button/Button.js
index 6c26c41d9e64ce..79f47d50b53eab 100644
--- a/packages/material-ui/src/Button/Button.js
+++ b/packages/material-ui/src/Button/Button.js
@@ -45,7 +45,9 @@ export const styles = theme => ({
     justifyContent: 'inherit',
   },
   /* Styles applied to the root element if `variant="text"`. */
-  text: {},
+  text: {
+    padding: theme.spacing.unit,
+  },
   /* Styles applied to the root element if `variant="text"` and `color="primary"`. */
   textPrimary: {
     color: theme.palette.primary.main,
@@ -250,9 +252,9 @@ function Button(props) {
       [classes.text]: text,
       [classes.textPrimary]: text && color === 'primary',
       [classes.textSecondary]: text && color === 'secondary',
-      [classes.flat]: variant === 'text' || variant === 'flat',
-      [classes.flatPrimary]: (variant === 'text' || variant === 'flat') && color === 'primary',
-      [classes.flatSecondary]: (variant === 'text' || variant === 'flat') && color === 'secondary',
+      [classes.flat]: text,
+      [classes.flatPrimary]: text && color === 'primary',
+      [classes.flatSecondary]: text && color === 'secondary',
       [classes.contained]: contained || fab,
       [classes.containedPrimary]: (contained || fab) && color === 'primary',
       [classes.containedSecondary]: (contained || fab) && color === 'secondary',
diff --git a/packages/material-ui/src/Button/Button.test.js b/packages/material-ui/src/Button/Button.test.js
index 220b5163cd25f3..edfd981f6be11a 100644
--- a/packages/material-ui/src/Button/Button.test.js
+++ b/packages/material-ui/src/Button/Button.test.js
@@ -28,6 +28,7 @@ describe('<Button />', () => {
     assert.strictEqual(wrapper.hasClass(classes.root), true);
     assert.strictEqual(wrapper.hasClass(classes.flat), true);
     assert.strictEqual(wrapper.hasClass(classes.fab), false);
+    assert.strictEqual(wrapper.hasClass(classes.text), true);
     assert.strictEqual(wrapper.hasClass(classes.textPrimary), false);
     assert.strictEqual(wrapper.hasClass(classes.textSecondary), false);
     assert.strictEqual(wrapper.hasClass(classes.flatPrimary), false);
@@ -75,6 +76,7 @@ describe('<Button />', () => {
     assert.strictEqual(wrapper.hasClass(classes.root), true);
     assert.strictEqual(wrapper.hasClass(classes.contained), true);
     assert.strictEqual(wrapper.hasClass(classes.fab), false);
+    assert.strictEqual(wrapper.hasClass(classes.text), false);
     assert.strictEqual(wrapper.hasClass(classes.textPrimary), false);
     assert.strictEqual(wrapper.hasClass(classes.textSecondary), false);
   });
@@ -88,6 +90,7 @@ describe('<Button />', () => {
     assert.strictEqual(wrapper.hasClass(classes.root), true);
     assert.strictEqual(wrapper.hasClass(classes.contained), true);
     assert.strictEqual(wrapper.hasClass(classes.fab), false);
+    assert.strictEqual(wrapper.hasClass(classes.text), false);
     assert.strictEqual(wrapper.hasClass(classes.containedPrimary), true);
     assert.strictEqual(wrapper.hasClass(classes.containedSecondary), false);
   });
@@ -101,6 +104,7 @@ describe('<Button />', () => {
     assert.strictEqual(wrapper.hasClass(classes.root), true);
     assert.strictEqual(wrapper.hasClass(classes.contained), true);
     assert.strictEqual(wrapper.hasClass(classes.fab), false);
+    assert.strictEqual(wrapper.hasClass(classes.text), false);
     assert.strictEqual(wrapper.hasClass(classes.containedPrimary), false);
     assert.strictEqual(wrapper.hasClass(classes.containedSecondary), true);
   });
@@ -108,6 +112,7 @@ describe('<Button />', () => {
   it('should render a small button', () => {
     const wrapper = shallow(<Button size="small">Hello World</Button>);
     assert.strictEqual(wrapper.hasClass(classes.root), true);
+    assert.strictEqual(wrapper.hasClass(classes.text), true);
     assert.strictEqual(wrapper.hasClass(classes.sizeSmall), true);
     assert.strictEqual(wrapper.hasClass(classes.sizeLarge), false);
   });
@@ -115,6 +120,7 @@ describe('<Button />', () => {
   it('should render a large button', () => {
     const wrapper = shallow(<Button size="large">Hello World</Button>);
     assert.strictEqual(wrapper.hasClass(classes.root), true);
+    assert.strictEqual(wrapper.hasClass(classes.text), true);
     assert.strictEqual(wrapper.hasClass(classes.sizeSmall), false);
     assert.strictEqual(wrapper.hasClass(classes.sizeLarge), true);
   });
@@ -134,6 +140,7 @@ describe('<Button />', () => {
       assert.strictEqual(wrapper.hasClass(classes.contained), true);
       assert.strictEqual(wrapper.hasClass(classes.raised), true);
       assert.strictEqual(wrapper.hasClass(classes.fab), false);
+      assert.strictEqual(wrapper.hasClass(classes.text), false);
       assert.strictEqual(wrapper.hasClass(classes.containedPrimary), false);
       assert.strictEqual(wrapper.hasClass(classes.raisedPrimary), false);
       assert.strictEqual(wrapper.hasClass(classes.containedSecondary), false);
@@ -150,6 +157,7 @@ describe('<Button />', () => {
       assert.strictEqual(wrapper.hasClass(classes.contained), true);
       assert.strictEqual(wrapper.hasClass(classes.raised), true);
       assert.strictEqual(wrapper.hasClass(classes.fab), false);
+      assert.strictEqual(wrapper.hasClass(classes.text), false);
       assert.strictEqual(wrapper.hasClass(classes.containedPrimary), true);
       assert.strictEqual(wrapper.hasClass(classes.raisedPrimary), true);
       assert.strictEqual(wrapper.hasClass(classes.containedSecondary), false);