Pattern Library

Kitchen Sink:

Colors

Theme

primary

secondary

tertiary

Standard

red

yellow

blue

green

Shades

white

black

gray-5

gray-4

gray-3

gray-2

gray-1

transparent

Icons

add

arrow-up

calendar

check

chevron-up

envelope

gift

heart-full

instagram

pinterest

remove

star-empty

triangle-left

twitter

warning

arrow-down

bag-empty

cart-add

chevron-down

credit-card

error

globe

history

location

print

search

star-full

triangle-right

user

youtube

arrow-left

bag-full

cart-empty

chevron-left

cross

facebook

google

home

menu

protected

secure

subtract

triangle-up

vimeo

zoom-in

arrow-right

balance

cart-full

chevron-right

document

flickr

heart-empty

info

phone

question

settings

triangle-down

truck

wallet

zoom-out

Typography

Heading Alpha Subheading

Heading Bravo Subheading

Heading Charlie Subheading

Heading Delta Subheading

Heading Echo

Heading Foxtrot

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent pellentesque eget orci nec luctus. In hendrerit felis nec eros cursus, vel vehicula diam sodales. Integer dictum lacus ligula, ut hendrerit tortor pretium nec. Praesent iaculis eu erat id elementum. Suspendisse ac dolor at lorem ultricies faucibus. Nam viverra nibh consequat, placerat ante vitae, commodo urna. Morbi quis ex ut neque bibendum lacinia auctor nec elit. Nullam sed quam nec urna vestibulum dignissim vel in tortor. Donec et pellentesque tellus. Sed tortor nisi, consequat commodo tellus at, facilisis condimentum ligula.

Font-Styles

This is font-style-1

This is still font-style-1. Lorem ipsum dolor sit amet, consectetuer adipiscing elit.

This is font-style-2

This is still font-style-2. Lorem ipsum dolor sit amet, consectetuer adipiscing elit.

Messages

Some kind of message

Some kind of error message

Some kind of info message

Some kind of success message

Some kind of warning message

Modifier: x-messages--borderless

Some kind of message without a border.

Buttons

Borders

Control Group

Standard Control Group

Control Group with Rounded Ends

Control Group with Rounded Right End

Control Group with Rounded Left End

Stacked Control Group

Divider

Standard Divider

Top Divider

Simple Tables

First Name	Last Name	Age
Roger	Waters	73
Nick	Mason	73
David	Gilmour	71

Stripped Tables

First Name	Last Name	Age
Roger	Waters	73
Nick	Mason	73
David	Gilmour	71

Forms

Default Form Layout

Customized Form Layout

Keyline

Modal

Sample Modal

Navigation

Grid Backgrounds

u-bg-

Foobar #1

Foobar #2

Foobar #3

background-color