Tabs
Basic Tab Bar
Basic Tab Bar w/ Custom Label Color
CSS-Only Tab Bar
CSS-Only Tab Bar w/ Custom Label Color
Icon Tab Labels
Icon Tab Labels w/ Custom Icon Color
CSS-Only Icon Tab Labels
CSS-Only Icon Tab Labels w/ Custom Icon Color
Icon & Text Labels
Icon & Text Labels w/ Custom Colors
CSS-Only Icon & Text Labels
CSS-Only Icon & Text Labels w/ Custom Colors
Custom Indicator Colors
Custom Indicator Colors - CSS-Only
Within mdc-toolbar
Within MDCToolbar - fixed to bottom of toolbar
Note: We want to avoid too many modifier classes for layouts like this. Therefore, we recommend overriding the style of mdc-toolbar__section for the MDCTabBar instance you'd like affixed to the bottom edge of mdc-toolbar. The style used to acheive this example is:

              
.my-modified-toolbar-section {
  position: absolute;
  right: 0;
  bottom: -16px;
}

[dir="rtl"] .my-modified-toolbar-section {
  right: auto;
  left: 0;
}
            
          
Within mdc-toolbar, CSS-Only
Within mdc-toolbar + custom color indicator
Note: Changing the toolbar's background color here so that the primary indicator can be visible
Within mdc-toolbar + custom color indicator, CSS-Only
Within Toolbar, Dynamic Content Control

Item One