title: How to override css in material UI?
body: <p>I am using material UI with reactjs. I want to override button color but in my case it changes tabs color also (see screenshot) how can I override button color only, using themes in material UI ? 
  Code: </p>
  
  <pre><code>const theme = createMuiTheme({
      palette: {
          primary: {
              main: '#DDB61A',
          },
          secondary: {
              main: '#1d83c6',
          },
      },
  });
  
  
  &lt;MuiThemeProvider theme={theme}&gt;
      &lt;AppBar position="static"&gt;
             &lt;Tabs value={value} onChange={this.handleTabChange}&gt;
             &lt;Tab label="USDT" /&gt;
             &lt;Tab label="BTC" /&gt;
             &lt;Tab label="ETH" /&gt;
             &lt;/Tabs&gt;
          &lt;/AppBar&gt;
  
      {value === 0 &amp;&amp; &lt;TabContainer&gt;
      &lt;Button variant="contained" color="primary" fullWidth={true}&gt;
                Buy/Login
           &lt;/Button&gt;
      &lt;/TabContainer&gt;}
  &lt;/MuiThemeProvider&gt;
  </code></pre>
  
  <p>2nd approach also doesn't work:</p>
  
  <pre><code>    const theme = createMuiTheme({
          palette: {
              myBtn: {
                  main: '#DDB61A',
              }
          }
      });
  
  &lt;MuiThemeProvider theme={theme}&gt;    
      &lt;Button variant="contained" color="myBtn" fullWidth={true}&gt;
            Buy/Login
      &lt;/Button&gt;
  &lt;/MuiThemeProvider&gt;
  </code></pre>
  
  <p>Screenshot:</p>
  
  <p><a href="https://i.stack.imgur.com/51KHi.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/51KHi.png" alt="enter image description here"></a></p>