Buttons communicate users that they can take actions. Their text label should remain on a single line, never wrapping the text.

Anatomy

1. Label
2. Icon (optional)
3. Container (transparent in text button)

https://invis.io/P4X2U51QE5W#/415641987_Button_Anatomy

Variations

Size

Solid

https://invis.io/ETX2TDFGNBK#/415636132_Solid_Button

Outline

https://invis.io/5BX2UCNSE3R#/415638906_Outline_Button

Text

https://invis.io/RAX2UE3WPSM#/415639228_Text_Button

Grouped

https://invis.io/4YX6WKUCXNH#/416745797_Grouped_Buttons

Toggle

https://invis.io/KHYQY988X2B#/431521004_Toggle_Buttons