Brand Guide
Brand Guide
Embedded Files
The Brand Style Guide is the foundation of how the brand is represented visually across all forms of communication including websites, social media platforms, brochures, SWAG, business cards, etc. The rules within the guide should be applied consistently so as to assure the professionalism and familiarity of the brand.
Logos
Logos
Primary Logos
For print and screen to be used interchangeably depending on available space. Color should be used unless black and white is the only option.
The star should always be white, unless placed on something that is transparent (water bottle, etc), then it should be transparent.
Logo Placement
Print: All printed documents need the non-taglined Gather logo in the header. Tagline logos can be used when placement requires more explanation of what GatherDC is.
Web: Tagline logos can be used when placement requires more explanation of what GatherDC is.
Email: Use color horizontal logo with tagline for email signatures.
Logo Don'ts
Do not stretch logo.
Never place logo on a cluttered photo background.
Do not make the star inside the Pin transparent (applies to both Icon & Logo). It should remain white unless when inverted or on a transparent background (like a water bottle)– then it should take on the color of the background.
Logo Accessibility
To check ADA compliance when creating materials, you can test using Color Review or Coolors.co.
Icons
Icons
Icon A can be used on a piece of swag when and only when the primary logo is used as well. The primary logo can be smaller than the icon if it looks appropriate.
Icon B is rarely utilized and should only be used with supervisor approval.
Black and white icons should only be used if the primary logo is black and white, and the star should always be white, unless placed on something that is transparent (water bottle, etc), then it should be transparent.
A.
B.
Icon Don'ts
Do not make the star inside the Pin transparent (applies to both Icon & Logo). It should remain white unless when inverted or on a transparent background (like a water bottle)– then it should take on the color of the background.
Icon Accessibility
To check ADA compliance when creating materials, you can test using Color Review or Coolors.co.
Inverted Logos and Icons
Inverted Logos and Icons
Use only when the background is black or placed on a darker brand color. Star should become transparent and should be the color of the background.
GatherNoVA Logos
GatherNoVA Logos
For print and screen to be used interchangeably depending on available space. Color should be used unless black and white is the only option. NoVA logos should only be used when communications are hyper-focused on the Northern Virginia area.
The star should always be white, unless placed on something that is transparent (water bottle, etc), then it should be transparent.
Colors
Colors
Primary Brand Colors
These are the colors that are used in the GatherDC and GatherNoVA logos. They should also be used in most Heading Content. See the Typography section for further instruction. NoVA colors should only be used when communications are hyper-focused on the Northern Virginia area.
Light Blue
CMYK: 70, 22, 0, 0
RGB: 54, 161, 218
HEX: #36A1DA
Dark Blue
CMYK: 95, 65, 19, 4
RGB: 7, 93, 146
HEX: #075D92
Web Blue
CMYK: 90, 32, 0, 66
RGB: 9, 59, 87
HEX: #093b57
NoVA Blue
CMYK: .99, .31, 0, .42
RGB: 2, 101, 147
HEX: #36A1DA
NoVA Orange
CMYK: 0, .51, .87, .12
RGB: 225, 111, 30
HEX: #e16f1e
Secondary Brand Colors
These are the colors to be used as backgrounds and for the Secondary and Tertiary Content. See the Typography section for further instruction. They will help add to the brand’s youthful, and optimistic quality. If patterns are ever incorporated in the branding, these are the colors that should be used. This pattern was inspired by the MTV branding below.
Lavender
CMYK:
9, 40, 0, 23
RGB:
70, 46, 77
HEX:
#B376C4
Red
CMYK:
0, 79, 56, 0
RGB:
241, 94, 97
HEX:
#F15E61
Secondary Blue
CMYK:
43, 3, 2, 0
RGB:
136, 205, 236
HEX:
#88CDEC
Cyan
CMYK:
.6, .09, 0, 0
RGB:
101, 231, 254
HEX:
#65e7fe
Yellow
CMYK:
0, .06, .87, 0
RGB:
255, 240, 34
HEX:
#fff022
Orange
CMYK:
0, .3, .75, .01
RGB:
252, 176, 64
HEX:
#fcb040
Green
CMYK:
.65, 0, .8, .08
RGB:
81, 234, 45
HEX:
#41EA2D
Color Don'ts
Don’t use any color other than those in the brand style guide.
In instances where customized colors are not possible, discuss with the team on which color is closest to branded colors and be sure to at least use branded colors in artwork on swag.
Color Accessibility
When choosing a color, especially in typography and iconography, a higher contrast against the background color is recommended to pass ADA compliance.
To check ADA compliance when creating materials, you can test using Color Review or Coolors.co.
Typography
Typography
Logo Font
When to Use: This is always the font to be used in relation to the logo.
Font: Porter Bold (no exceptions). NEVER ITALICIZE
Heading Font
When to Use: Used for website content, blog content, and marketing material content headings (including website menu).
Font: Porter Bold (if not available, use Montserrat Bold). NEVER ITALICIZE
On a light colored background, use primary colors or black. For dark background (which should be used sparingly if ever), use white.
Primary Content
When to Use: Used for website content, blog content, marketing material content, and any written content in general, including internal documents.
Secondary Content
When to Use: Used for taglines under the logo, links on websites, secondary points on marketing materials.
Font: Gotham Bold and/or Regular (if not available, use matching weight for Verdana). NEVER ITALICIZE
On light backgrounds, use either a Primary Color you did not use for the Primary Content, or any of the darker shaded Secondary Colors. For dark background (which should be used sparingly if ever), use any of the lighter shaded Secondary Colors.
(or)
Tertiary Content
When to Use: Use to emphasize something graphically. Used mostly when wanting to be playful.
Font: Satisfy (Always use lowercase for every letter). NEVER ITALICIZE
Any of the Primary or Secondary Colors can be used with this typeface. When picking a color for this font, think "playful".
Typography Don'ts
Don’t use any color other than those in the brand style guide.
In instances where customized colors are not possible, discuss with the team on which color is closest to branded colors and be sure to at least use branded colors in artwork on swag.
No white text on light blue background.
No yellow text.
Typography Accessibility
On light backgrounds, use primary colors or black. For dark background (which should be used sparingly), use white text.
To check ADA compliance when creating materials, you can test using Color Review or Coolors.co.
Page updated
Report abuse