Color and Typeface

Color and Typeface

I recently had a chat with my partner (CEO of Ambiance Matchmaking) about our company's brand image and the type of members to whom we cater. "I want to invest more time into fewer clients," she told me. We both agreed that in order to achieve this, we couldn't take everyone as a member. We would have to be even more selective, and we would have to raise our prices. I would need to take the company from "Matchmaker for the everyday single" to "Exclusive Matchmaker for the selective."

This calls for a slight rebranding!

I'll do this through changing the company's visual elements (color, typeface, photos) and communication (writing styles). Today, we focus on using color and typeface as a rebranding tool.



Why is color important?

Colors evoke feelings and emotions, whether you realize it or not. Colors make people feel a certain way about your company, and help them remember who you are and what you do. 

It's important to choose colors that represent your brand identity. Start by becoming aware of what each color represents (ie: gold=luxury, white=purity, green=health, wealth, etc).

How to choose color

First, if you have no experience with color design, check out this article, Learn the Basics of Color Theory to Know What Looks Good. It explains color theory in simple terms.

I started my process by asking myself these questions...

1. What should our colors express?
Upscale, luxury, elegant, classic.

2. Which colors express this?
Dark purple = royalty, luxury, power, ambition, wealth, extravagance, creativity, wisdom, dignity, and grandeur.
Gold = success, achievement and triumph.
Dark blue = elegant, rich, sophisticated, intelligent, and old-fashioned.
Gray is a timeless color that can be used to express sophistication. 

Keeping the above in mind, I started exploring specific tints, shades, and saturations of the above colors...

  • I used a Pinterest mood board to collect photos of colors I liked

  • I searched Design Seeds for different color palettes

  • I used Adobe Color CC to play with the color wheel and preset color templates

Then, using the ColorPick Eyedropper Chrome extension, I was able to grab the exact hex codes of the colors I liked.

Design Seeds

Design Seeds

Then, I went to Adobe Color CC to plugin my primary color and make a palette. I chose a dark purple (#06081A) as my primary color.

Adobe Color CC utilizes 7 "Color Rules:" analogous, monochromatic, triad, complementary, compound, shades, and custom. 

I decided to make a custom scheme, and ended up with the following...

My final palette

Final color palette

Final color palette

Dark purple (#06081A)
Purple (#221A35)
Muave (#AF9E9E)
Soft white (#FCFCFC)
Rich gold (#B6793D)

My primary colors (dark and light purple) may be used for banner fallback colors, footer space, and the like. 
My accent color (gold) may be used for active navigation, links, and subheadings.
Soft white will be used as background color.
Dark gray (#333333) will be our web text color.



Why is typeface important?

Just like color, typeface evokes specific thoughts and emotions. It is important that your brand uses the right typography to express its personality. For example, a cake boutique may use a soft and elegant typeface, while a sports company may use a strong and geometric typeface.

When creating a logo, establish a more unique or quirky appearance in order to stand out from the crowd, while still making the design simple. The less distracted the person is with the overall design, the more the message and concept will shine through. 

How to choose your typeface

There are many websites for learning how to choose and pair your typeface. One of my favorites is TypeWolf, which has lots of great resources for choosing the right typeface for your design project. It even has a Flawless Typography Checklist which works as an interactive visual checklist.

In order to choose the right typeface for Ambiance Matchmaking, again I started my process by asking myself these questions...

1. What should our typeface express?

Upscale, luxury, elegant, classic.

2. What style of typeface would express this?

Logo: Traditional, classic, high contrast of thick and thin strokes.

Website: Traditional, classic, simple, easy to read.

With this information, I went to TypeWolf for inspiration. After finding a few that I liked, I went to Pixelmator to start testing. Tip: If you can't find a font you like in your design platform (in this case, Pixelmator), you can import more fonts.

My final choice

For our logo, I chose Darleston.

Final logo design

Final logo design

For our website, I chose the following:
Headings: Retiro STD 24PT (weight 700)
Subheadings: Roboto (weight 300)
Body text: Roboto (weight 300)

Take a look at the final product:

Rewinding & Rewriting

Rewinding & Rewriting

Nice To Meet You

Nice To Meet You