Predefined colors from CDG Style Guide, and one created (Purple).
Red – Source – 6f1200
Yellow – Source – bc8d0a
Blue – Source – 002d56
Green – Source – 3a4c00
Purple – created – 3c003d
Note:
Will also use #121212 for black (text).
The Red and Yellow are in the logo. In the old website the Red is used extensively as a background for numerous elements, with the Blue and Yellow as secondary and tertiary colors.
Blue is used as a background color in various elements with white text and the Yellow is used for links. The Green is in the style guide provided from the city, it’s really not used at all in the old website.
Red – Source – 6f1200
Red 2 created – 8c4133
Red 3 created – a97166
Red 4 created – c5a099
Red 5 created – e2d0cc
Red – Source+1 – 8f1800
Red 2 created – a54633
Red 3 created – bc7466
Red 4 created – d2a399
Red 5 created – e9d1cc
Red – Source+2 – a31b00
Red 2 created – b54933
Red 3 created – c87666
Red 4 created – daa499
Red 5 created – edd1cc
Yellow – Source – bc8d0a
Yellow 2 created – c9a43b
Yellow 3 created – d7bb6c
Yellow 4 created -e4d19d
Yellow 5 created – f2e8ce
Yellow – Source+1 – D59F0B
Yellow 2 created – DDB23C
Yellow 3 created – E6C56D
Yellow 4 created -EED99D
Yellow 5 created – F7ECCE
Yellow – Source+2 – E9AE0C
Yellow 2 created – EDBE3D
Yellow 3 created – F2CE6D
Yellow 4 created -F6DF9E
Yellow 5 created – FBEFCE
Blue – Source – 002d56
Blue 2 created – 335778
Blue 3 created – 66819a
Blue 4 created – 99abbb
Blue 5 created – ccd5dd
Blue – Source+1 – 003f7a
Blue 2 created – 336595
Blue 3 created – 668caf
Blue 4 created – 99b2ca
Blue 5 created – ccd9e4
Blue – Source+2 – 004A8F
Blue 2 created – 336ea5
Blue 3 created – 6692bc
Blue 4 created – 99b7d2
Blue 5 created – ccdbe9
Green – Source – 3a4c00
Green 2 created – 617033
Green 3 created – 899466
Green 4 created – b0b799
Green 5 created – d8dbcc
Green – Source+1 – 4e6600
Green 2 created – 718533
Green 3 created – 95a366
Green 4 created – b2c299
Green 5 created – dce0cc
Green – Source+2 – 5e7a00
Green 2 created – 7e9533
Green 3 created – 9eaf66
Green 4 created – bfca99
Green 5 created – dfe4cc
Purple – created – 3c003d
Purple 2 created – 633364
Purple 3 created – 8a668b
Purple 4 created – b199b1
Purple 5 created – d8ccd8
Purple – created+1 – 500052
Purple 2 created – 733375
Purple 3 created – 966697
Purple 4 created – b999ba
Purple 5 created – dcccdc
Purple – created+2 – 640066
Purple 2 created – 833385
Purple 3 created – a266a3
Purple 4 created – c199c2
Purple 5 created – e0cce0
Typography
Montserrat for headings and Open Sans for body copy.
Headings
Montserrat is used for all Headings. The design refresh needs a more modern look, using a clean sans serif font helps this.
Second choice was using Merriweather serif for H1, H2, H3 and Montserrat for H4, H5, H6.
(Merriweather serif matches the logo, Montserrat reads better at smaller sizes.)
A distant third was using Merriweather Sans for the headings as it also is harder to read as it gets smaller (the kerning is too tight and the font weight is too heavy).
H1 – Heading 1 – This is heading number 1
H2 – Heading 2 – This is heading number 2
H3 – Heading 3 – This is heading number 3
H4 – Heading 4 – This is heading number 4
H5 – Heading 5 – This is heading number 5
H6 – Heading 6 – This is heading number 6
Body
Open Sans will be used for all of the body copy.
Rubik and Inter were almost tied with the edge going to Rubik for second place and Inter with third.
Montserrat was also considered, but, it’s nearly equal kearning between letters, and higher letter height worked against it for readability in paragraph format, which also meant that it needed more space on the screen for the same number of words.
More Info On Source And Created Colors
Branding Document from City of Mount Vernon:
red: #6f1200 (tetradic created: blue – #005D6F) (monochromatic created: #A21A00)
Yellow: #bc8d0a (mono: ECB10D)(analog: BC340A)
Green: #3a4c00 (tetra: 004C38, 4C0014)(triad: 003A4C, 4C003A)(analog: 144C00, 4C3800)
Blue: #002d56 (comp: 562900)(mono: 004889)(analog: 005654)(triad: 56002D, 2D5600)(tetra: 540056, 562900, 025600)
The logos I’ve got produce these sets of colors with my color palette generator:
The main logo:
Pirate Gold: #B38304
Red Oxide: #630404
Peru Tan: #803004
Oregon: #8C4404
— Dark Burgundy: #701604
— Totem Pole: #942F04
— Chelsea Gem: #945404
Other tiles:
1) MV After Dark
— Green Vogue: #042B53
—— or use Madison: #082C54 (preferred slightly)
— Dark Burgandy: #6C1304
— Tamarind: #1B0A18
— Cocoa Bean: #4E1C1C
2) Color swatch from City of Mount Vernon Brand Guidelines document
— Birch: #363127
— Grain Brown: #DED1AF
— Silver Chalice: #A6A6A6
— Oslo Gray: #8E9091
3) MVAAC Logo
— Blackcurrant: #342B3D
— Pampas: #EEEBE7 (nice white alt background)
— Cadet Blue: #A3B7C6
— Bali Hai: #7C94AE (nice old tyme light blue)
4) Uptown Thursday Nights
— Green Kelp: #2E4629
— Green White: #E4E8DD
— Bermuda Gray: #718BA3 (nice light old tyme blue)
— Green Smoke: #9CAC79 (cheerful light green)
5) Heritage Days
— Dark Burgundy: #6B1404
— Blue Whale: #042B50
— Pirate Gold: #B17F04
— Yukon Gold: #7A6204
Misc colors:
— Wine Berry: #5C1830
— Alpine: #BA8E30 (nicer version of primary yellow)
— Sage: #959878
— Burnt Orange: #E28D3B
— Scarlet: #C13004
— Rodeo Dust: #C8AE95
— Sage: #8FA680
— Lynch: #6C7494 (blue periwinkle – less purple)
— Edward: #AAAEAA (gray sage)
