Website Theme & Style Guide
Colour Palette
Green
1. Primary Accent [Links]
#7CB240
Polo Blue
2. Alt Accent [Hover]
#B5D591
Black
3. Strongest Text
#000000
Dark Charcoal
4. Strong Text
#333333
Tulip Tree
5. Medium Text
#E4A944
Aztec Sky
6. Subtle Text
#4BB5D8
Dark Charcoal
7. Subtle Background
#E4E2E2
Alice Blue
8. Lighter Background
#F7FAFC
White
9. Page Background
#FFFFFF
Gray
10. Other BG
# 888888
Typography
Managed in Customize > General > Typography
Heading Font: Name Here
Base Font: Name Here
Font size: 16px
Font line height: 1.5em
Font weight: 400 (normal)
Type Samples: H1 Heading goes here. H1 Heading goes here. H1 Heading goes here.
H2 Heading goes here. H2 Heading goes here. H2 Heading goes here.
H3 Heading goes here. H3 Heading goes here. H3 Heading goes here.
H4 Heading goes here. H4 Heading goes here. H4 Heading goes here. H4 Heading goes here.
Here is a paragraph of text. This is a link. Here is a paragraph of text. Here is a paragraph of text. This is a link. Here is a paragraph of text. Here is a paragraph of text. Here is a paragraph of text.
This is a blockquote. This is a blockquote. This is a blockquote. This is a blockquote. This is a blockquote. This is a blockquote. This is a blockquote.
- Bulleted List Item
- Bulleted List Item
- Sub Item
- Bulleted List Item
- Bulleted List Item
- Sub Item
Desktop Layout Specs
- Default Layout: 1140px Design Grid (header/footer, generic content, blog pages, 3-column grids)
- 3 x 360px design columns
- 30px gutters
- Wide Layout: CSS 1440 Grid (wider home page content, 4-column grids for product listings etc)
- 4 x 330px columns
- 30px gutters
Mobile Layout Specs
- Tablet (iPad): 2 columns Canvas width: 768px
- Handheld (iPhone): 1 column Canvas width: 375px
- 360px design columns from desktop layout may be pasted in and stacked