title: Angular material icon mat-icon is not displaying correctly
body: <p>I am creating Navigation drawer in my angular 4 app using angular-material.
  Initially, I am creating a toolbar to have header and menu button(mat-icon is menu)</p>
  
  <p>Here is my code,</p>
  
  <pre><code>&lt;mat-toolbar class="example-header" color="primary"&gt;
      &lt;button mat-icon-button&gt;&lt;mat-icon&gt;menu&lt;/mat-icon&gt;&lt;/button&gt;
  &lt;span class="header-name"&gt;Hello&lt;/span&gt;
  &lt;/mat-toolbar&gt;
  </code></pre>
  
  <p>But I am getting the output as follows,</p>
  
  <p><a href="https://i.stack.imgur.com/4X6VY.png" rel="noreferrer"><img src="https://i.stack.imgur.com/4X6VY.png" alt="enter image description here"></a></p>
  
  <p>But I wanted output something like this,</p>
  
  <p><a href="https://i.stack.imgur.com/ZuuQH.png" rel="noreferrer"><img src="https://i.stack.imgur.com/ZuuQH.png" alt="enter image description here"></a></p>
  
  <p>The difference in the output is, the mat-icon button has grey background whereas the required doesn't.
  Please correct me.</p>
  
  <p>The app.module.ts</p>
  
  <pre><code>import { BrowserModule } from '@angular/platform-browser';
  import { NgModule } from '@angular/core';
  import { AgmCoreModule } from '@agm/core';
  import { MapsAPILoader } from '@agm/core';
  import { FormsModule } from '@angular/forms';
  import { GoogleMapsAPIWrapper } from '@agm/core';
  import { AppComponent } from './app.component';
  import 'hammerjs';
  import {
    MatAutocompleteModule,
    MatButtonModule,
    MatButtonToggleModule,
    MatCardModule,
    MatCheckboxModule,
    MatChipsModule,
    MatDatepickerModule,
    MatDialogModule,
    MatExpansionModule,
    MatFormFieldModule,
    MatGridListModule,
    MatIconModule,
    MatInputModule,
    MatListModule,
    MatMenuModule,
    MatNativeDateModule,
    MatPaginatorModule,
    MatProgressBarModule,
    MatProgressSpinnerModule,
    MatRadioModule,
    MatRippleModule,
    MatSelectModule,
    MatSidenavModule,
    MatDrawer, MatDrawerContainer, MatDrawerContent,
    MatSliderModule,
    MatSlideToggleModule,
    MatSnackBarModule,
    MatSortModule,
    MatTableModule,
    MatTabsModule,
    MatToolbarModule,
    MatTooltipModule,
  
    MatStepperModule,
    MATERIAL_SANITY_CHECKS
  } from '@angular/material';
  import {BrowserAnimationsModule} from '@angular/platform-browser/animations';
  
  
  @NgModule({
    declarations: [
      AppComponent
    ],
    imports: [
      BrowserModule,
      FormsModule,
      BrowserAnimationsModule,
      MatToolbarModule,
      MatSidenavModule,
      MatIconModule
    ],
    providers: [GoogleMapsAPIWrapper],
    bootstrap: [AppComponent]
  })
  export class AppModule { }
  </code></pre>