Image, Color, & Font Specs

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

  • Hero Background Image (both Large and Small): 1800px × 1200px
  • Footer CTA Image: 900px × 600px
  • Alternative Footer CTA Image Headshot: 150px × 150px
  • Alternative Footer CTA Image Background Image: 1800px × 1200px
  • Inline body copy Image (for example, within a simple Blog post): 1000px × Any Height
  • 2-Column Image / Text Block Image: 900px × 600px
  • 2-Column Video / Text Block Overlay Image: 1200px × 675px
  • Testimonial Headshot: 75px × 75px
  • Case Study Large Background Image: 900px × 600px
  • Case Study Client Logo (ideally, export .svg file format of logo): 200px × Any Height
  • Logo Block Images: 200px × Any Height
  • Large Clickable Image Card Image: 900px × 600px
  • Icon (for “Icon Blurbs” and for “Clickable Icon Cards”)(ideally, export as .svg file): 75px × 75px
  • Blog Post Featured Image: 900px × 600px

Font Specifics

  • body, p, ol, ul (Desktop) – Usual, 400 • 16px/1.7 • Color: #626767 • Letter-Spacing: .25px • Margin: 0 0 25px
  • body, p, ol, ul (Tablet) – • 15px/
  • body, p, ol, ul (Mobile) – • 14px/
  • p.intro (Desktop) – • 20px/1.5
  • p.intro (Tablet) – • 19px/
  • p.intro (Mobile) – • 18px/
  • Blockquote p (Desktop) – • 20px/1.5
  • Blockquote p (Tablet) – • 19px/
  • Blockquote p (Mobile) – • 16px/
  • H1 (Desktop) – Usual, 600 • 55px/1.3 • Color: #353534 • Margin: 0 0 25px
  • H1 (Tablet) – • 40px/
  • H1 (Mobile) – • 28px/
  • H2 (Desktop) – Usual, 600 • 30px/1.3 • Color: #353534 • Margin: 0 0 20px
  • H2 (Tablet) – • 28px/
  • H2 (Mobile) – • 23px/
  • H3 (Desktop) – Usual, 600 • 22px/1.3 • Color: #353534 • Margin: 0 0 10px
  • H3 (Tablet) – • 21px/
  • H3 (Mobile) – • 19px/
  • H4 (Desktop) – Usual, 600 • 18px/1.4 • Color: #353534 • Margin: 0 0 10px
  • H4 (Tablet) – • 17px/
  • H4 (Mobile) – • 16px/
  • H5 (Desktop) – Usual, 600 • 16px/1.4 • Color: #353534 • Letter-Spacing: .5px • Margin: 0 0 10px
  • H5 (Tablet) – • 15px/
  • H5 (Mobile) – • 14px/
  • H6 (Desktop) – Usual, 600 • 16px/1.4 • Color: #353534 • Letter-Spacing: .5 • Margin: 0 0 10px
  • H6 (Tablet) – • 15px/
  • H6 (Mobile) – • 14px/
  • Pre-Title (Desktop) – Usual, 600 • 13px/1.5 • Color: #353534 • Letter-Spacing: .75px • Margin: 0 0 20px
  • Pre-Title (Tablet) – • 12px/
  • Pre-Title (Mobile) – • 11px/

Site Color Values

 

#353534
 

#004f50
 

#34bcb2
 

#ffffff