Basic Typography

Headings

Karla Regular - h1

Karla Bold - h2

Karla Regular - h3

Karla Regular - h4

Karla Bold - h5
Karla Regular - h6

Paragraphs

Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam, eaque ipsa quae ab illo inventore veritatis et quasi architecto beatae vitae dicta sunt explicabo.

Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam, eaque ipsa quae ab illo inventore veritatis et quasi architecto beatae vitae dicta sunt explicabo.

HTML Elements

UI Elements

Link Text

Form Elements





Display Elements

Column 1 Column 2 Column 3
Table Cell Table Cell Table Cell
Table Cell Table Cell Table Cell
Table Cell Table Cell Table Cell

Blockquote - Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.

Quote - Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.
Citation

Jamesway Specifics

Colours

UI Elements

Standard buttons

Anchor w/ .button

Colour Modifiers

Size Modifiers - large

Size Modifiers - small

Using the anchor tag

.button .button--primary .button .button--secondary .button .button--cta

With Icon


.button .button--secondary

Just Icon


Components

Banner

Input with attached button