Say Hello to the City | Brand Style Guide

b r a n d s t y l e g u i d e | m a r c h 2 0 1 6

P R I M A R Y L O G O

m i n i m u m s i z e

The smallest the logo should be util ized is 15 px or .20” high.

S A Y H E L L O T O T H E C I T Y

To ensure legibil ity and a clean look, always keep a minimum clear space around the logo. This applies to the primary logo and all logo variations.

The minimum value for clear space is half of the logotype’s height. For example, if the primary logo is being used at its minimum size, .20”, then there should be a .10” border of clear space on all four sides of the mark. For logo variations, use the height of “Say” as a marker for clear space. Clear space may always be increased, but it should not be lesser than the minimum. This necessary space isolates the mark from any conflicting design elements that might detract from the look and hierarchy of the logo.

c l e a r s p a c e

B R A N D S T Y L E G U I D E | 3

L O G O V A R I A T I O N S

1

2

3

4

5


Say Hello to the City’s branding includes 5 supplementary logos. These logo variations may be used to replace the primary logo.

Options 1 and 2 introduce a one-line tag l ine and an extended tag l ine, respectively. Option 3 is a monogrammed, simplified version of the logo and should only be used when the primary logo is also visible. The vertically stacked logo variation may be used in its original format (option 4) or may be reversed out on a solid, contrasting-colored circle (option 5).

n o t e s


C O L O R S

w a r m s a n d

p a l e s k y

s l a t e b l u e

c i n d e r

a s h

c h a r c o a l


CMYK: 3, 7, 16, 0 / RGB: 244, 233, 211 / #F4E9D3

CMYK: 5, 2, 2, 0 / RGB: 237, 242, 245 / #EFF3F6

CMYK: 23, 10, 10, 0 / RGB: 195, 210, 217 / #C3D2D9

CMYK: 19% black / RGB: 207, 207, 207 / #CFCFCF

CMYK: 40% black / RGB: 155, 155, 155 / #9B9B9B

CMYK: 95% black / RGB: 13, 13, 13 / #0D0D0D

warm sand

pale sky

slate blue

cinder

ash

charcoal

v a l u e s

The color palette for Say Hello to the City reflects a warm, minimalistic aesthetic. Color use should be kept simple to maintain a clean look.

All logos should be displayed in charcoal or white. Instead of using pure black for the logo, which can appear harsh, charcoal is a 95% black that aligns the aesthetic with the accessibil ity of the brand. Slate blue and all grey variations are suitable for font colors and accents. Warm sand and pale sky are suitable for accent colors.


A C C E P T A B L E L O G O U S E


If placed on a l ight colored background, always use the logo in charcoal. If placed in a very dark background, it is appropriate to use the logo in white.

When placing the logo on top of photos, it’s important to create proper contrast between the photo and the logo. If placed on a l ight photo, use the logo in charcoal. When using the circle logo in charcoal, it is acceptable to use transparent letters. If placing the logo on a dark or busy photo, use the circle logo in charcoal with white letters or use a white circle logo with transparent letters.

n o t e s


U N A C C E P T A B L E L O G O U S E


Don’t rotate the logo. Don’t rearrange or resize elements of the logo. Don’t disproportionately scale the logo. Don’t use different colors for different elements of the logo. Don’t use any colors not included in the style guide. Don’t use any colors besides charcoal or white for the logo.

Don’t place the logo in a white box on top of photos. Don’t use a charcoal logo on top of dark or busy photos. Don’t use a white logo on top of l ight photos. Don’t use the circle logo with transparent letters on top of dark or busy logos.

n o t e s

B R A N D S T Y L E G U I D E | 1 1

T Y P O G R A P H Y

Brandon Text - L ightWeb letter spacing / 1.5 px

Web letter spacing / 0.5 px

Ke p l e r D i s p l a y - S e m i b o l d It a l i cWeb letter spacing / 1.5 px

B R A N D O N G R O T E S Q U E - B L A C KWeb letter spacing / 2.5 px


Typography should be consistent to reinforce a classic and cohesive look across platforms. Say Hello to the city’s logotype is constructed with Brandon Grotesque in Black and Kepler Standard Display in Semibold. Font weights may be edited to ensure legibil ity.

Brandon Grotesque is a geometric sans-serif typeface with rounded corners to soften the starkness of its angles. It should be used for emphasized text (such as quotes) or in all caps for main headers.

Kepler Standard Display is an elegant modern serif with call igraphic references. Kepler Display in Semibold Italic should be used for headers and subheaders. Kepler Display in Regular may be used for body text.

Brandon Text is the companion to Brandon Grotesque optimized for long texts and smaller sizes. It may be used for body text.

n o t e s


Photography featured on the Say Hello to the City blog and any portraits or branded photos that represent the brand externally should reinforce the brand’s visual aesthetic.

Natural l ight should be used whenever possible and be featured as a key visual aspect of each photo. Colors should not be overly edited or saturated. Portrait style is relaxed and spontaneous. If appropriate, negative space should be generous and bright.

p h o t o s t y l e g u i d e


The moodboard for Say Hello to the City acts as a visual reference point that reflects the key characteristics of the brand.

The brand’s visual identity aims to convey warmth, simplicity, structured and clean design, and a bright outlook. The core aesthetic of Say Hello to the City’s visual expression is warm minimalism.

m o o d b o a r d


d e s i g n e d b y c a i t g o o d m a n

for any questions or clarifications, please contact [email protected]

Documents

Say Hello to the City | Brand Style Guide