title: Angular Material 5 set fab button default color
body: <p>I am using Anuglar Material (5.0.4) and I would like the <code>mat-fab-button</code> default background color to be white like it is in the <a href="https://material.angular.io/components/button/examples" rel="nofollow noreferrer">Angular examples</a>. However for me the background color is the accent color for some reason.</p>
  
  <p><a href="https://i.stack.imgur.com/OOgsh.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/OOgsh.png" alt="enter image description here"></a></p>
  
  <p><strong>HTML</strong></p>
  
  <pre class="lang-xml prettyprint-override"><code>&lt;h2&gt;Fab Buttons&lt;/h2&gt;
  &lt;div&gt;
    &lt;button mat-fab&gt;Basic&lt;/button&gt;
    &lt;button mat-fab color="primary"&gt;Primary&lt;/button&gt;
    &lt;button mat-fab color="accent"&gt;Accent&lt;/button&gt;
    &lt;button mat-fab color="warn"&gt;Warn&lt;/button&gt;
    &lt;button mat-fab disabled&gt;Disabled&lt;/button&gt;
    &lt;button mat-fab&gt;
      &lt;mat-icon aria-label="Example icon-button with a whats hot icon"&gt;whatshot&lt;/mat-icon&gt;
    &lt;/button&gt;
    &lt;a mat-fab routerLink="."&gt;Link&lt;/a&gt;
  &lt;/div&gt;
  
  &lt;h2&gt;Mini Fab Buttons&lt;/h2&gt;
  &lt;div&gt;
    &lt;button mat-mini-fab&gt;Basic&lt;/button&gt;
    &lt;button mat-mini-fab color="primary"&gt;Primary&lt;/button&gt;
    &lt;button mat-mini-fab color="accent"&gt;Accent&lt;/button&gt;
    &lt;button mat-mini-fab color="warn"&gt;Warn&lt;/button&gt;
    &lt;button mat-mini-fab disabled&gt;Disabled&lt;/button&gt;
    &lt;button mat-mini-fab&gt;
      &lt;mat-icon aria-label="Example icon-button with a whats hot icon"&gt;whatshot&lt;/mat-icon&gt;
    &lt;/button&gt;
    &lt;a mat-mini-fab routerLink="."&gt;Link&lt;/a&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p><strong>Theme</strong></p>
  
  <pre class="lang-css prettyprint-override"><code>$deeporange-teal-amber-theme-primary: mat-palette($mat-deep-orange, 500, 100, 700);
  $deeporange-teal-amber-theme-accent: mat-palette($mat-teal);
  $deeporange-teal-amber-theme-warn: mat-palette($mat-amber);
  
  $deeporange-teal-amber-theme: mat-light-theme(
    $deeporange-teal-amber-theme-primary,
    $deeporange-teal-amber-theme-accent,
    $deeporange-teal-amber-theme-warn);
  </code></pre>
  
  <p>The weird thing is <code>mat-raised-button</code> has a white background.</p>