How To / 

Style Guide

A quick reference for the image sizes, fonts and colors used across the site.

Please reference the list below whenever you’re creating new images for your site. You should find a size for all possible images you’ll need/use.

Image Sizes

  • Square Photo (1:1 aspect ratio): 1200px × 1200px
  • Horizontal Photo (3:2 aspect ratio): 1800px × 1200px
  • Vertical Photo (2:3 aspect ratio): 1200px × 1800px
  • Logos Page Block: 150px × 100px
  • Logos Page Block: 225px × 150px
  • Icon (1:1 aspect ratio): 75px × 75px

Font Specifics

  • H1 (Desktop) – Poppins, 300 • 38px/1.18 • Color: #1B2B54 • Margin: 0 0 20px
  • H2 (Desktop) – Poppins, 300 • 38/1.21 • Color: #1B2B54 • Margin: 0 0 20px
  • H3 (Desktop) – Poppins, 400 • 22px/1.3 • Color: #1B2B54 • Letter-Spacing: .25px • Margin: 0 0 10px
  • H4 (Desktop) – Poppins, 400 • 20px/1.4 • Color: #1B2B54 • Letter-Spacing: .25px • Margin: 0 0 10px
  • H5 (Desktop) – Poppins, 400, ALL CAPS • 16px/1.47 • Color: #1B2B54 • Letter-Spacing: 2px • Margin: 0 0 10px
  • H6 (Desktop) – Poppins, 400 • 16px/1.47 • Color: #1B2B54 • Letter-Spacing: .25px • Margin: 0 0 10px
  • body, p, ol, ul (Desktop) – Open Sans, 400 • 16px/1.8 • Color: #6c7388 • Letter-Spacing: .25px • Margin: 0 0 25px
  • p.intro (Desktop) – • 20px/

Site Color Values

 

#1B2B54
 

#2FCB40
 

#767F98
 

#2B72B2
 

#E8EAEE
 

#f7f8fa
 

#6c7388
 

#57C2B4
 

#FFA539
 

#274181