<divclass="top-app-bar"><divclass="top-app-bar__action"><buttontype="button"class="icon-button"><spanclass="material-icons">menu</span></button></div><divclass="top-app-bar__title text-align-center">
Title
</div><divclass="top-app-bar__action"><buttontype="button"class="icon-button"><spanclass="material-icons">search</span></button></div><divclass="top-app-bar__action"><buttontype="button"class="icon-button"><spanclass="material-icons">notifications</span></button></div><divclass="top-app-bar__action"><buttontype="button"class="icon-button"><spanclass="material-icons">account_circle</span></button></div></div>
Small app bar
Title
<divclass="top-app-bar"><divclass="top-app-bar__action"><buttontype="button"class="icon-button"><spanclass="material-icons">arrow_back</span></button></div><divclass="top-app-bar__title">
Title
</div><divclass="top-app-bar__action"><buttontype="button"class="icon-button"><spanclass="material-icons">search</span></button></div><divclass="top-app-bar__action"><buttontype="button"class="icon-button"><spanclass="material-icons">notifications</span></button></div><divclass="top-app-bar__action"><buttontype="button"class="icon-button"><spanclass="material-icons">account_circle</span></button></div></div>
Medium app bar
Headline Small
<divclass="background-surface"><divclass="top-app-bar"><divclass="top-app-bar__action"><buttontype="button"class="icon-button"><spanclass="material-icons">arrow_back</span></button></div><divclass="top-app-bar__title"></div><divclass="top-app-bar__action"><buttontype="button"class="icon-button"><spanclass="material-icons">search</span></button></div><divclass="top-app-bar__action"><buttontype="button"class="icon-button"><spanclass="material-icons">notifications</span></button></div><divclass="top-app-bar__action"><buttontype="button"class="icon-button"><spanclass="material-icons">account_circle</span></button></div></div><divclass="headline-small padding-3">
Headline Small
</div></div>
Large app bar
Headline Medium
<divclass="background-surface"><divclass="top-app-bar"><divclass="top-app-bar__action"><buttontype="button"class="icon-button"><spanclass="material-icons">arrow_back</span></button></div><divclass="top-app-bar__title"></div><divclass="top-app-bar__action"><buttontype="button"class="icon-button"><spanclass="material-icons">search</span></button></div><divclass="top-app-bar__action"><buttontype="button"class="icon-button"><spanclass="material-icons">notifications</span></button></div><divclass="top-app-bar__action"><buttontype="button"class="icon-button"><spanclass="material-icons">account_circle</span></button></div></div><divclass="headline-medium padding-x-3 padding-y-4">
Headline Medium
</div></div>