title: How to change text, icon and underline color of Select in Material UI
body: <p>So I want to change the <strong>text</strong>, <strong>icon</strong> and <strong>underline</strong> color of Material UI Select component from black to white, which looks like this:</p>
  
  <p><a href="https://i.stack.imgur.com/jSXRk.png" rel="noreferrer"><img src="https://i.stack.imgur.com/jSXRk.png" alt="enter image description here"></a></p>
  
  <p>The options text colors which are implemented by MenuItem are looking good by default, because they are grey on white:</p>
  
  <p><a href="https://i.stack.imgur.com/ZklIP.png" rel="noreferrer"><img src="https://i.stack.imgur.com/ZklIP.png" alt="enter image description here"></a></p>
  
  <p>I original <a href="https://material-ui.com/api/select/" rel="noreferrer">documentation of Select</a> does not help much, because it doesn't say which CSS class I should override in classes.</p>
  
  <pre><code>import React from "react";
  import ReactDOM from "react-dom";
  import { withStyles } from "@material-ui/core/styles";
  import FormControl from "@material-ui/core/FormControl";
  import Select from "@material-ui/core/Select";
  import MenuItem from "@material-ui/core/MenuItem";
  
  const styles = theme =&gt; ({
    root: {
      background: "blue",
      backgroundColor: "blue"
    }
  });
  
  const OPTIONS = {
    A: "Option A",
    B: "Option B"
  };
  
  class App extends React.Component {
    state = {
      option: OPTIONS.A
    };
    handleOptionChange = event =&gt; {
      return this.setState({ option: event.target.value });
    };
  
    render() {
      const { classes } = this.props;
      return (
        &lt;div className={classes.root}&gt;
          &lt;FormControl variant="outlined"&gt;
            &lt;Select
              value={this.state.option}
              onChange={this.handleOptionChange}
              name="optionsDropdown"
            &gt;
              &lt;MenuItem value={OPTIONS.A}&gt;{OPTIONS.A}&lt;/MenuItem&gt;
              &lt;MenuItem value={OPTIONS.B}&gt;{OPTIONS.B}&lt;/MenuItem&gt;
            &lt;/Select&gt;
          &lt;/FormControl&gt;
        &lt;/div&gt;
      );
    }
  }
  const DemoApp = withStyles(styles)(App);
  const rootElement = document.getElementById("root");
  ReactDOM.render(&lt;DemoApp /&gt;, rootElement);
  </code></pre>