title: How to change the background colour of mat-select and change edge of select box to rounded style?
body: <p>Can anyone help me with changing the colour of <code>mat-select</code> box and how to style the box to have rounded corners.
  I tried by giving it the <code>background-colour</code> property but it is not affecting my element.</p>
  <p><strong>html</strong></p>
  <pre><code> &lt;mat-form-field appearance=&quot;outline&quot;&gt; 
         &lt;mat-select class=&quot;topunit&quot;&gt;
            &lt;mat-option *ngFor=&quot;let x of filteredData [value]=&quot;x&quot;&gt;{{x.name}} - {{x.place}} 
            &lt;/mat-option&gt;
         &lt;/mat-select&gt;
      &lt;/mat-form-field&gt;
  </code></pre>
  <p><strong>css</strong></p>
  <pre><code>.topunit{
      background-color: white;
      margin-top: 5%;
      padding: 0 0.75em 0 0.75em;
      width: 75%;
      align-items: baseline;
      border-radius: 20px;
  }
  </code></pre>