Style guide for website
Logos
Purple #775ba5
Light Purple #a795c7
Grey #babfc3
Green #92c83f
Yellow #fee101
Tan #e5ae51
Orange #f47121
Color 8 (not black but dark) #262e44
Podcast Green #93c700
Poker Red #bd1505
For Background colors use 10% of our Brand Colors
Dark Purple
Light Purple
Gray
Green
Yellow
Tan
Orange
Fonts
Open Sans
This is Open Sans
The quick brown fox jumps over the lazy dog
Montserrat
This is Montserrat Font
The quick brown fox jumps over the lazy dog
Montserrat Semi-Bold 600
The quick brown fox jumps over the lazy dog
Ephesis
Font for “Hero” images
Design -> Typography
Headings
Font = Montserrat | Variant = Medium 500 | Font size = 48 px | Line hight = 1.1 | Text Transformation= Upper Case
Subheading
Subheading = Font = Montserrat | Variant = Normal 400 | Font size = 22 px | Line hight = 1.2 | Text Transformation = None
Body
Font = Open Sans | Variant = Normal 400 | Font size = 16 px | Line hight = 1.5 | Text Transformation = None
Featured Image
Text Shadow = Yes
Position = 2 /2
Blur Radius = 2
Color = Black
Images need to be 1200X750 (or 2400X1500)
Font size is 8VW
Photos
Drop Shadow = Yes
3px Rounded corners
For the home page “What’s Happening” Section
The photo should be 600 px by 280px
Contianer Spacing
40px Top Margin and 45px Bottom Margin
Dates
June 7th – 14th 2023
Best Practices
- Use Preview but do not edit the preview… (look for url/?preview_id=xxx)
- Add Names to each Container
- For long content pages, you can use anchors end menu anchors (url/#anchor)
- Don’t use upper case but apply a “text Transformation”
- When adding new pages, use a parent page when appropriate
Marketing
To track any marketing program or campaign campaign with Google Analytics you should use the following format:
Add the following to your url “?utm_source=news4&utm_medium=email&utm_campaign=spring-summer”
use the Google Analytics Tool at https://ga-dev-tools.google/ga4/campaign-url-builder/
Contact info for Cary Pearlman
[email protected] 312.212.0490 Desk (not text)
