GiveGab Branding Guidelines
GiveGab Logos & Icons
Acceptable Variations
Acceptable Brand Backgrounds
Avoid mid-toned backgrounds. For example, the logo should not appear on a gray darker than #eaeaea.
Usage: Treatment
Spacing
Wherever the logo appears, there should be sufficient space surrounding it. Space should be no smaller than the width and height of the letter “e” within the GiveGab logo.
Trademark
The registered trademark symbol should also appear anytime the logo is used.
Text Treatment
When writing about GiveGab within a body of text, use two capital “G”s with no space between the words “Give” and “Gab”.
Usage: Things to Avoid
Do not add visual effects to the logo (shadows, glows, outlines, etc.).
Do not change the logo's orientation or stretch it's proportions.
Do not place the logo on visually busy or “vibrating” backgrounds.
Do not use colors outside of GiveGab's color palette.
Brand Colors
Primary & Secondary Colors
Primary Colors
Blue
#0FC2EC
Orange
#FF8B22
Navy
#364D63
Secondary Colors
Faint Gray
#FAFAFA
Light Gray
#EAEAEA
Mid Gray
#AAAAAA
Dark Gray
#6D6D6D
Fonts & Text
Brand Fonts
Primary Headers
Museo Slab 500* is GiveGab's primary font for headlines. We occasionally make use of the font's various weight options for emphasis or differentiation.
Secondary Headers & Body Text
Proxima Nova is GiveGab's primary font for body text. We also occasionally use this font for headlines on the web.
Acceptable Substitutions
In the case that GiveGab's primary fonts are not available, a substitution from this list may be used. All are free to download online.
Body Text & Headlines
Body Text/Paragraphs
Body text is primarily dark gray and between 16-18px.
Appropriate line height is applied to promote readability. Paragraphs are left-aligned and are less than 16 words per line.
Headlines
Museo Slab is GiveGab's primary font for headers. Occasionally, Proxima Nova is used as well.
Navy is the primary header color. Other acceptable header colors include dark gray and sometimes orange.
Links & Quotations
Links
Links that appear within body text are bold and blue. Links can also appear gray or orange depending on their context.
Quotations
Quotes primarily use Museo Slab 500, and are italic, blue, centered, h1 size, and appear with quotes around them.
Always allow for proper line height and padding around quotes and be sure to cite the author.
Images & Illustrations
Image Usage: General Strategy
Quality
GiveGab always uses high-quality images on its materials. No grainy, pixelated images allowed! We also help to educate our nonprofit partners on best practices for attaining and using high-quality images.
Realistic
We choose candid-looking photos over cheesy, posed-looking ones. The content and subjects within our photos are relatable and should speak to or represent our target demographics.
Accessible
On the web, keep our image sizes relatively low, swap out large images for small ones for mobile devices, and include alt tags.
*Stay Away From:
Use your best judgment to steer clear of images that appear “cheesy”, are trying too hard to communicate an abstract idea, or are of low visual quality.
Design Principles
Foundational Values for GiveGab Design
Unity
GiveGab designs and interfaces make use of GiveGab’s official guidelines which provide a basis for a unified and consistent experience across mediums.
User-Focus
We design for our users, not for ourselves. Our aim is to create user-friendly, appealing, and
delightful solutions that attract customers and help them to easily accomplish their goals. We
value client feedback as a way to improve and grow our products. Our designs are flexible and
evolve over time to meet client needs and changes in target demographics.
Craftmanship
GiveGab produces designs that are high quality, well-crafted, and thoughtful. We care about
details and improve our designs through research, feedback, collaboration, iteration, and
fine-tuning. We take ownership of what we create and only deliver solutions we’re proud of.
Simplicity & Cleanliness
GiveGab designs make good use of white space, clean lines, and a simple color palette. We strive
against cluttered interfaces in favor of focused-design that reduces visual and cognitive strain
whenever possible.