Colors

text

text, inverted

link

link, hover

link inverted

link, inv, hover

background

bg, transparent

bg, inverted

bg, inv, transp

border

border, inverted

surface

surface, inverted

primary

highlight

success

success, light

error

error, light

disabled

sale

discount

Typography

Heading 1

Heading 2

Heading 3

Lorem ipsum dolor, sit amet consectetur adipisicing elit. Iusto iste ratione praesentium? Exercitationem numquam laudantium omnis consequuntur id placeat dignissimos consectetur officia deleniti, alias, impedit doloremque eligendi provident debitis obcaecati!

Link

Mark

Styled
Unordered
List

Heading (%heading)

Title (%title)

Ingress (%ingress)

Disclaimer (%disclaimer)

Muted (%muted)

Loud (%loud)

Form label (%form-label)

Styled Heading, h1

And Body

Styled Heading, h2

And Body

Styled Heading, h3

And Body

Forms

Input

InputLorem lorem helper

InputHas an error

InputLorem lorem helperHas an error

Use borders

Input with borders

Input with bordersLorem lorem helper

Input with bordersHas an error

Input with bordersLorem lorem helperHas an error

Checkbox

Checkbox (checked)

Checkbox List

CheckboxList - First

CheckboxList - Second

CheckboxList - Third

Radio

Radio (checked)

Styled Input

Has an error

Buttons

Button

Disabled

Has rounded design

Small

Square

Square, small

Is loading, has loader

Styled Action Button

Navigation

Breadcrumbs

Home / Page Name

Home / Level / Page Name

Home / Level / Next Level / Page Name

Pager