Design Guide

A complete guide to all typography, colors, and elements for your new website.

Typography

Headings, body and other

common text elements.

Heading one

Heading two

Heading three

Heading four

Heading five

Heading six

Heading Overline

X-Large Text
Every day is taco ipsum tuesday. Give me tacos, or give me death.

Large Text
Every day is taco ipsum tuesday. Give me tacos, or give me death.

Body Text
Every day is taco ipsum tuesday. How bout a gosh darn quesadilla? If you were a taco, would you eat yourself? Black or pinto beans? It?s a wonderful morning for breakfast tacos.

Text Link

Small Text
Every day is taco ipsum tuesday. Give me tacos, or give me death.

Buttons

Button styles and size variations.

Button Primary Button Secondary Button small Button Outline

Button White

Colors

A complete color swatch

used to color all interface

elements on the website.

Primary

Secondary

Dark

Light Grey

White

Black / Text

Icons

Common interface

and social network iconography.

Small Icon

Medium Icon

Large Icon

X-Large Icon

Images

Image styles including normal,

hover, and muted.

Normal image with hover effect

Muted image

Shadow

Shadow styles used on the website.

Medium Shadow

2XL Shadow

Spacing & Border Radius

A complete spacing guide

Selectors for padding, margin

and space below items.

Padding 1x

Padding 2x

Padding 3x

Margin 1x

Margin 2x

Margin 3x

Margin 4x

border radius

Margin Bottom 2x

Margin Bottom 3x

Margin Bottom 4x

Margin Bottom 5x