Component directory

Buttons

Button groups

Button groups organize buttons and add interactions between them

Common buttons

Buttons prompt most actions in a UI

Icon buttons

Icon buttons help people take actions with a single tap

Split buttons

Split buttons open a menu to give people more options related to an action

Form elements

Checkbox

Checkboxes let users select one or more items from a list, or turn an item on or off

Radio button

Radio buttons let people select one option from a set of options

Sliders

Sliders allow users to make selections from a range of values

Switch

Switches toggle the selection of an item on and off

Text fields

Text fields let users enter text into a UI

Informational

Menus

Menus display a list of choices on a temporary surface

Tooltips

Tooltips display brief labels or messages

Loading & progress

Progress indicators

Progress indicators show the status of a process in real time

Navigation

Navigation rail

Navigation rails let people switch between UI views on mid-sized and larger devices

Tabs

Tabs organize content across different screens and views

Structural

Cards

Cards display content and actions about a single subject

Dividers

Dividers are thin lines that group content in lists or other containers

Lists

Lists are continuous, vertical indexes of text and images

Utility

Icons

Icons represent ideas through an abstract pictograph