title: How to change color of button in material ui using "&:active":?
body: <p>i am using material ui in my project. I want to change the active state of my button. i am using active and hover of material ui, i.e</p>
  <pre><code>const useStyles = makeStyles((theme) =&gt; ({
    button: {
      &quot;&amp;:hover&quot;: {
        boxShadow: &quot;none&quot;,
        background: &quot;red&quot;
      },
      &quot;&amp;:active&quot;: {
        boxShadow: &quot;none&quot;,
        background: &quot;black&quot;
      }
    }
  }));
  </code></pre>
  <p>but hover is working, but not active.
  <a href="https://codesandbox.io/s/material-demo-forked-zv9vt?file=/demo.js" rel="nofollow noreferrer">https://codesandbox.io/s/material-demo-forked-zv9vt?file=/demo.js</a></p>