Brand Self-Care: Type + Color

We’re in part four of the Brand-Self Care series — all about type + color styles!

I could nerd out over this topic allll day — it’s what really makes a design shine! We’ll dive into the main considerations with color + type, but keep in mind there are a ton of technical considerations (such as kerning, color profiles, etc.) to look into once your type + color guides are created.

TYPE STYLE GUIDE

I’ve said this a million times over the years — typography is what makes or breaks a design. If the type within a design is sub-par, the entire brand feels the same. While a brand with fantastic typography can really elevate the entire identity. There are multiple brands that lean heavily on strong typesetting over complex logos, patterns, or graphic elements. Brands like Everlane, Artifact Uprising and Appointed come to mind. Fantastic typography and photography can do the heavy lifting.

Here are a few type considerations:

Use case — While designing for any aspect of a brand it’s important to consider where the brand will be used primarily. Web? Printed books? Packaging? Likely there will be a blend of various uses, but focusing on the primary medium will help inform the other areas. For instance: when designing type pairings for the web, you’ll want to consider a highly legible body copy font that translates well to the screen. While for print design, you can go much smaller in type size.

Hierarchy + contrast — allows readers to quickly understand how content is organized, significant statements, descriptors, and explanatory copy. This doesn’t necessarily mean significant statements need to be big and bold. There aren’t set “rules” to organizing hierarchy. White space, font variations (bold, caps, italics) can also serve as signifiers in the hierarchy, and provide contrast.

Versatility — When selecting typefaces for ourselves or clients, I favor versatility. Typefaces that include various weights (bold, italic, text, etc.) find a fan in me. Though we do incorporate typefaces (especially for display uses) that don’t have as much versatility, it’s something we consider when selecting type.

Legibility — I know, I know. The fancy fonts are fun, and I might be boring you with these “type rules!” But they are here for a reason. Legibility is KEY when selecting the type. Does your typeface read well when reduced small, while also looks beautifully scaled large? Some type that’s not as legible (handwritten scripts for example) are not off-limits, though they should be used sparingly.

COLOR STYLE GUIDE

We’ve worked hard throughout our Brand Self-Care series already — are you ready for it? It’s finally time to add some color to your brand! Hopefully, you’ve been patient and laid a strong foundation visually + strategically through designing in black and white, and now you’re ready to bring more personality to your design. Or maybe your brand lends itself to b&w, and that’s okay to go bold and minimal like that too :).

Here are a few color considerations:

Color psychology — Each color has an impact on us psychologically. It’s important to understand the emotional connections to colors especially when designing for brands. For example, a soft blue feels fresh, trusting, and peaceful. While red feels passionate, energetic, and urgent. Fast food restaurants are known for using red as it enhances appetite and urgency to eat. (note to self: stay away from red restaurants 🙂 ). Banks use the color blue often as it feels established and secure.

I wouldn’t get too hung up on color psychology, but it’s important to consider!

Personality — Along with psychology, each color conveys personality. Refer back to your discovery phase and pull out words that describe your brand. For example, “playful” might feel more bright in saturation, compared to “elegant” which might include more soft neutrals.

Contrast — As you’re building your color style guide consider contrast. Not only does incorporating contrast lend itself to a diverse palette, but it also allows for improved legibility when colors are overlaid. You can pull colors opposite to each other on the color wheel to find the most contrast, and adjust from there for your brand.

Warm/cool tones — Consider including warm tones (reds, oranges, yellows) as well as contrasting cool tones (blues, greens, purples).

Brand palette categories — I didn’t learn this in design school, but I’ve found it helpful to include the following three categories when developing brand color palettes: Primary (the main brand colors that will be most associated with your design), Secondary (allow for versatility such as branded products, packaging, sub-brands) and Neutrals (lighter tints of the other colors, grays, ivories — great to use on website backgrounds, pull quotes, etc.).

For our clients, we typically include 3 colors in each category. If you’re a color master, you can get away with more if you know how/when to use them :).

APPLICATION

It’s tough to select type + color without seeing them in the application. Even though our clients don’t typically have a promotion for us to create, during our brand presentations we always create faux promos to help envision the entire brand in context. This helps us see the type + color together, rather than listing out as a style guide typically does.

For our Dwell Hotel example above, it shows what this type guide would look like on the top as compared to the type + color application on the bottom. You can get a much greater feel of how the brand works together through layout application. Use actual copy or application if you have something in mind (FB ad, homepage hero layout, social media template, etc.), or just come up with something to show the styles working together. If you plan to design for the web, it’s ideal to include a button or link style as well during this phase.

ACTION ITEMS:

1. Create your type + color style guide

2. Tag @spruceroad on Instagram and use the #brandselfcare hashtag so we can follow along together! I’d love to see your process!