Style Guide

Site Logo: 2560x640px 4:1

Page Footer

Palette

Black Haze

Atoll

Tory Blue

Tabasco

Shark

Black

White

Transparent

#f2f3f3

#086268

#0e50b4

#ac1f0c

#1e2125

#000000

#ffffff

#ff00ff

Content

Headers are styled for desktop and mobile. The font in both cases is Poppins set to a medium weight headers and regular for paragraphs. Styles are calculated using the Typescale.

Desktop

TypeScale: 1.250 Major Third

Headers

• Weight : 500

• Line Height: 1.15

• h1-61.04px

• h2-48.83px

• h3-39.06px

• h4-31.25px

• h5-25px

• h6-20px

Paragraphs

• Weight : 400

• Line Height: 1.65

• p1-20px

• p2-16px

• p3-12.8px

Mobile

TypeScale: 1.125 Major Second

Headers

• Weight: 500

• Line Height: 1.15

• h1-32.44px

• h2-28.83px

• h3-25.63px

• h4-22.78px

• h5-20.25px

• h6-18px

Paragraphs

• Weight: 400

• Line Height: 1.65

• p1-18px

• p2-16px

• p3-14.22px

Blog & Spec Catalogs

• 4 - columns

• 32px - top/bottom margin

• 46px - left/right margin (mobile)

• 48 - items/page