Styleguide
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
- Homepage Hero: 1600 px (min.) × 675 px (min.)
- 2, 3, 4 Across Page Block Images: 750px × 500px
- Left/Right Page Block Images: 750px × 525px
- Full-Width Page Block BG Image: 1600px (min.) × 735px
- Sidebar Images: 750px × Any
- Interior Hero: 1600px (min.) × 325px
- Team Page Headshot: 750px × 750px
- Event/Blog Image: 750px × 500px
Font Specifics
- H1 – Museo Sans, 700, ALL CAPS • 48px/56px • Color: #000000 • Margin: 0 0 15px
- H1 Tablet – Museo Sans, 700, ALL CAPS • 42px/52px • Color: #000000 • Margin: 0 0 15px
- H1 Mobile – Museo Sans, 700, ALL CAPS • 36px/46px • Color: #000000 • Margin: 0 0 15px
- H2 – Museo Sans, 700, ALL CAPS • 36px/44px • Color: #000000 • Margin: 0 0 15px
- H2 Tablet – Museo Sans, 700, ALL CAPS • 32px/42px • Color: #000000 • Margin: 0 0 15px
- H3 – Museo Sans, 700 • 28px/36px • Color: #000000 • Margin: 0 0 15px
- H4 – Museo Sans, 300, Italic • 20px/30px • Color: #222222 • Margin: 0 0 20px
- H5 – Museo Sans, 700 • 20px/30px • Color: #000000 • Margin: 0 0 10px
- H6 – Museo Sans, 700, ALL CAPS • 18px/24px • Color: #000000 • Margin: 0 0 15px
- Paragraph Text – Verdana, 400 • 14px/30px • Color: #222222 • Margin: 0 0 25px
- Paragraph Link – Verdana, 700 • 14px/30px • Color: #d2252c
- Open Content Header – Museo Sans, 700, ALL CAPS • 24px/36px • Color: #000000 • Margin: 0 0 10px
- Open Content Header Tablet – Museo Sans, 700, ALL CAPS • 20px/30px • Color: #000000 • Margin: 0 0 10px
- Open Content Paragraph – Verdana, 400 • 14px/26px • Color: #222222 • Margin: 0 0 25px
- Open Content Paragraph Tablet – Verdana, 400 • 13px/24px • Color: #222222 • Margin: 0 0 25px
- Open Content Link – Museo Sans, 700 • 18px/18px • Color: #d2252c
- Photo/Video Caption – Museo Sans, 500 • 16px/24px • Color: #000000
- Block Quote Text – Museo Sans, 300, Italic • 24px/38px • Color: #222222
- Block Quote Attribution – Museo Sans, 700, ALL CAPS • 18px/18px • Color: #d2252c
Site Color Values
|
#d2252c |
|
#ab1d22 |
|
#343434 |
|
#1a1a1a |
|
#222222 |
|
#000000 |
|
#ffffff |
Support the Chicago Teachers Union Foundation