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
- Image Block (default size): 1000 × 1000px WebP
- Image Block (tall image): 666 × 1000px WebP
- Image Block (wide image): 1000 × 666px WebP
- Logos Block Logo: 400 × 200px WebP or SVG
- Columns Block Icon: 200 × 200px WebP or SVG (CSS preferred when possible)
- Columns Block Image Card (background image): 1000 × 1000px WebP
- Blurbs Block Custom Icon: 80 × 80px WebP or SVG (CSS preferred when possible)
- CTA Block Side Image: 1000 × 1000px WebP
- CTA Block Icon: 400px Max-Width × 125px WebP or SVG (CSS preferred when possible)
- Calculator Block Side Image: 1000 × 1000px WebP
- Header Block Image: 1000 × 666px WebP
- Home Hero (wide images): 1000 × 666px WebP
- Home Hero (square images): 1000 × 1000px WebP
- Home Hero Illustration: 400 × 400px WebP or SVG (CSS preferred when possible)
Font Specifics
- Fonts Used: Adelle Sans Regular and Bold, Source Sans Pro Regular, Semibold, Bold (italics for all if kit weight allows) – • /
- H1 & H2 on white, gray, light blue bkgds – • / • Color: #151D8E
- H1 & H2 on blue bkgds – • / • Color: #FFF
- Text over white, gray, light blue bkgds – • / • Color: #1B1D1F
- Text over blue bkgds – • / • Color: rgba(255,255,255,0.8)
- Accent light blue over white bkgds – • / • Color: #0099FD
- Accent light blue over gray and light blue bkgds – • / • Color: #008FEC
- Accent green over blue bkgds – • / • Color: #2FE2A9
- H1: Mobile – Adelle Sans, 700 • 32/42px • Margin: 0 0 20px; Padding: 0;
- H1: Tablet & Desktop – • 48/60px
- H2: Mobile – Adelle Sans, Bold • 29/40px • Margin: 0 0 20px; Padding: 0;
- H2: Tablet & Desktop – • 44/54px
- H3: Mobile – Adelle Sans, Bold • 26/40px • Margin: 0 0 10px; Padding: 10px 0 0;
- H3: Tablet & Desktop – • 30/40px
- H4 – Adelle Sans, Bold • 22/32px • Margin: 0 0 10px; Padding: 10px 0 0;
- Paragraph Text – Source Sans Prod, 400 • 19/32px • Margin: 0 0 20px; Padding: 0;
- Intro Paragraph Class: Mobile – • 22/34px
- Intro Paragraph Class: Tablet & Desktop – • 25/38px
- Pre-Title Class – Source Sans Pro, 600 • 15/20px • Margin: 0 0 10px; Padding: 0;
- Small Text Class — TBD if necessary – • /
- Legal Text Class – • 12/16px • Margin: 0 0 12px;
- UL & OL – • / • Margin: See Design – Padding: 10px 0;
- LI’s – Same as P text – See designs for spacing • /
Site Color Values
| #151D8E | |
| #0099FD | |
| #008FEC | |
| #E6F5FF | |
| #F0F1F2 | |
| rgba(255,255,255,0.8) | |
| #FFF | |
| #2FE2A9 | |
| #1B1D1F |