Buttons
Default buttons
The default button is 48px high and should always be used as the main CTA. Where a different size is required, refer to the resizing section below.
Background: #00D659 | Text size: 16px | Text colour: #3C3E49 | Corner radius: 3px
Solid button:
:active
:hover
:disabled
:focus
:loading
Solid button build:
Solid button with icon: Icon size: 16 x 16px Icon color: Same as text color
:active
:hover
:disabled
:focus
Button
Button
Button
Button
Solid button with icon build:
Outline button:
:active
:hover
:disabled
:focus
Outline button build:
Outline button with icon:
:active
:hover
:disabled
:focus
Button
Button
Button
Button
Outline button with icon build:
Warning button:
:active
:hover
:disabled
:focus
:loading
Warning button build:
Warning button with icon:
:active
:hover
:disabled
:focus
Button
Button
Button
Button
Warning button with icon build:
Resizing the default buttons
The default button styles can be resized to make Large, Small and XSmall buttons
LARGE: Height 64px | Text:16px
SMALL: Height 40px | Text:12px
XSMALL: Height 32px | Text:12px
