Style Guide

This style guide provides a central location to make stylistic changes to your site.
Note: Change the colors through the swatches panel. This will change all locations where the color is used on the website.

Color Palette

VIRIDIAN GREEN
Viridian Green - 50
#e8f5f7
Viridian Green - 100
#d9f1ef
Viridian Green - 250
#8dced5
Viridian Green - 500
#32a7b3
Viridian Green - 750
#0e4f56
Viridian Green - 900
#0a2124
HAN PURPLE
Han Purple - 50
#eee9ff
Han Purple - 500
#6236ff
MOUNTAIN MEADOW
Mountain Meadow - 50
#e6f8f3
Mountain Meadow
- 500
#00b982
MAXIMUM YELLOW RED
Maximum Yellow Red - 50
#fef8ea
Maximum Yellow Red - 500
#f9ba31
CARDINAL
Cardinal - 50
#fae9ea
Cardinal - 500
#cf2230

Typography

H1 / Hero Title
Size: 64px
The quick brown fox jumps over the lazy dog.
H1 / H1 Title
Size: 56px

The quick brown fox jumps over the lazy dog.

H2 / H2 Title
Size: 48px

The quick brown fox jumps over the lazy dog.

H3 / H3 Title
Size: 40px

The quick brown fox jumps over the lazy dog.

H4 / H4 Title
Size: 32px

The quick brown fox jumps over the lazy dog.

H5 / H5 Title
Size: 24px
The quick brown fox jumps over the lazy dog.
H6 / H6 Title
Size: 18px
The quick brown fox jumps over the lazy dog.
Title
Size: 16px
This is a title
Paragraph (Large)
Size: 18px

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse varius enim in eros elementum tristique. Duis cursus, mi quis viverra ornare, eros dolor interdum nulla, ut commodo diam libero vitae erat. Aenean faucibus nibh et justo cursus id rutrum lorem imperdiet. Nunc ut sem vitae risus tristique posuere.

Paragraph (Medium)
Size: 16px

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse varius enim in eros elementum tristique. Duis cursus, mi quis viverra ornare, eros dolor interdum nulla, ut commodo diam libero vitae erat. Aenean faucibus nibh et justo cursus id rutrum lorem imperdiet. Nunc ut sem vitae risus tristique posuere.

Paragraph (Small)
Size: 18px

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse varius enim in eros elementum tristique. Duis cursus, mi quis viverra ornare, eros dolor interdum nulla, ut commodo diam libero vitae erat. Aenean faucibus nibh et justo cursus id rutrum lorem imperdiet. Nunc ut sem vitae risus tristique posuere.