Buttons

This component styling should have the base button styling that is common on the majority of the application/website including size, font-size, color, border style/color/size, paddings, margins, etc. To add additional styling that is specify for one component use --modifiers. For example: c-Button.c-Button--signup

base

c-Button

Button

c-Button

is-secondary

Button

c-Button

is-tertiary

Button

c-Button

is-quaternary

Button

--modifiers

c-Button

c-Button--l

Button

c-Button

is-secondary

Button

c-Button

is-tertiary

Button

c-Button

is-quaternary

Button

c-Button

c-Button--m

Button
Button

c-Button

is-secondary

Button

c-Button

is-tertiary

Button

c-Button

is-quaternary

Button

c-Button

c-Button--s

Button

c-Button

is-secondary

Button

c-Button

is-tertiary

Button

c-Button

is-quaternary

Button

c-Button

is-secondary

Button

Toggle

Lists & tabs

Form Elements

Thank you! Your submission has been received!
Oops! Something went wrong while submitting the form
Thank you! Your submission has been received!
Oops! Something went wrong while submitting the form
Thank you! Your submission has been received!
Oops! Something went wrong while submitting the form
Thank you! Your submission has been received!
Oops! Something went wrong while submitting the form

Heading Teaser

back to top Arrow