Button Toggle

mat-button-toggle-group for single and multi selection.

Single Selection

Button toggle group with exclusive selection (single choice).

HTML

<mat-button-toggle-group>
  <mat-button-toggle value="bold" aria-label="Bold">
    <mat-icon>format_bold</mat-icon>
  </mat-button-toggle>
  <mat-button-toggle value="italic" aria-label="Italic">
    <mat-icon>format_italic</mat-icon>
  </mat-button-toggle>
  <mat-button-toggle value="underline" aria-label="Underline">
    <mat-icon>format_underline</mat-icon>
  </mat-button-toggle>
</mat-button-toggle-group>

Multi Selection

Button toggle group with multiple selection enabled.

HTML

<mat-button-toggle-group [multiple]="true">
  <mat-button-toggle value="fluent">Fluent</mat-button-toggle>
  <mat-button-toggle value="angular">Angular</mat-button-toggle>
  <mat-button-toggle value="vue">Vue</mat-button-toggle>
  <mat-button-toggle value="react">React</mat-button-toggle>
</mat-button-toggle-group>