Style Guide. A company identity kit for brand management, style & usage

Transcription

1 Style Guide A company identity kit for brand management, style & usage October 2017

2 2

3 How to use this Branding Guide This document is a detailed handbook for anyone using or working with our brand: staff, partners, designers and vendors. It describes how to use the brand elements like the logo, colors, and brand name. Most importantly, this style and usage identity kit is to protect the look, feel, tone and culture of our company. 3

4 Naming Delaware Small Business Chamber is the sole and exclusive owner of all the rights to the Delaware Small Business name. REGISTERED: Delaware Small Business Chamber COLLOQUIAL: DSBC The Delaware Small Business Chamber is an Independent Chamber of Commerce supporting small business throughout the State of Delaware and the surrounding business communities. Our focus is on businesses with 0 to 100 employees and any business that economically supports our local small business community. DSBC in text Delaware Small Business Chamber is always a proper noun. It may appear as Delaware Small Business Chamber or DSBC. Slogan The True Resource for Delaware Small Businesses 4

5 new pic(s) 5

6 Our Logo Our horizontal logo is always preferred for most applications of the DSBC brand. It should appear on a white background. However, situations may arise in which it makes more sense to use our secondary logo or a single color logo. Consistency across applications ensures that the latest evolution of our brand is synonymous with the DSBC name and reputation. These are the only approved versions of the DSBC. Artwork for all versions of the DSBC logo are available in CMYK, Pantone and RGB to accommodate almost any need that may arise. What Not to Do Keeping the integrity of our brand is crucial. Here are some examples of what NOT to do with our DSBC logo. Colors Never alter the colors from the official artwork. Never replace our logo colors. Never use non-brand patterns or backgrounds behind the logotype. When logo of text is shown on a photographic background, the image should always be light or dark enough to ensure substantial contrast. Shape Never shrink or stretch the logotype. Never spin, tilt, angle or alter the logotype. It has been designed to be read horizontally. Endorsement Do not place the logo in an endorsement phrase. 6

7 Main Logo 1 Color Alternate: Mentor Logo Alternate: Fun Fest 7

8 Primary Color Palette Bright Blue Indigo Pantone 7460 C Pantone 7687 C CMYK: c93 m34 y0 k22 CMYK: c70 m60 y0 k44 RGB r13 g132 b199 RGB r43 g57 b144 HEX #0d84c7 HEX #2b3990 Color Distribution Use plenty of open white space in your DSBC designs. The use of white keeps the design feeling open, free and clear. The Primary Palette is the best color representation. The other colors in the Secondary Palette are meant for displaying chartdata clearly and are to be used sparingly. 8

9 Secondary Color Palette - yellow and light blue Yellow Baby Blue Pantone 1225 C Pantone 318 C CMYK: c0 m21 y77 k1 CMYK: c33 m8 y0 k7 RGB r252 g199 b58 RGB r159 g219 b237 HEX # fcc73a HEX #9fdbed 9

10 Company Font Fira Sans The Fira typefaces aim to cover the legibility needs for a large range of handsets varying in screen quality and rendering. Font family can be downloaded here: Fira Sans Light Regular Regular Italic Medium Medium Italic Bold Bold Italic 10

11 System Fonts Arial may be used for applications were Fira Sans is not available. Arial Regular Regular Italic Bold Bold Italic Web Fonts Due to the progression of web technology, custom fonts can now be used on the web The font family Fira Sans has a web version which can be downloaded from Font Squirrel: Font-family and fall backs: Fira Sans, Helvetica, Arial, sans-serif Font weights used: Regular, Medium, and Bold 11

12 Print Fonts Heading 1: Fira Sans Regular 40pt/50pt Bright Blue Heading 2: Fira Sans Regular 32pt/40pt Indigo Heading 3: Fira Sans Light 26pt/32pt 85% Black Heading 4: Fira Sans Regular 20pt/26pt 85% Black Heading 5: Fira Sans Bold 16pt/20pt 85% Black Heading 6: Fira Sans Bold 14pt/18pt 85% Black Body copy is set at 14pt/18pt 85% Black. This is an example of the Body Font in Fira Sans Regular. An example in Fira Sans Italic. An example of Fira Sans Bold. 12

13 Section Title Fira Sans Bold 16pt/20pt 100% Indigo This treatment of text allows a reader to easily scan the left hand side of a document for important sections. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Curabitur laoreet, dolor nec rutrum rutrum, elit ex vulputate purus, in ultrices libero nulla et quam. Duis mollis quis tortor eget cursus. Pull and block quotes should be indented & formated in Fira Sans Medium 20pt/24pt in Bright Blue Main Crosshead 14pt/18pt Maecenas sapien odio, malesuada vel sollicitudin id, eleifend et massa. Aliquam vulputate magna at orci mattis facilisis. Cras rutrum gravida congue. Example caption: Mauris ultrices et ex et tristique. Ut sed dapibus est. In pulvinar sagittis leo, non maximus erat volutpat imperdiet. Set 12pt/15pt 85% Black. Run-in sidehead Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; In pharetra mattis sollicitudin. Donec cursus vitae metus sit amet viverra. Donec risus velit, porta eu orci id, faucibus maximus neque. 13

14 Imagery We use pictures of our chamber events when high quality photos are available. (Please make sure that photo releases are signed prior to using images) We have also included stock photos that allow text to be placed upon them on the following pages. Images should accommodate our slogan or any other simple message or promotion. When to Use Images To breakup text Social media backgrounds Printed pieces Proposal covers Presentation title pages or section break pages Posters Office art 14

15 15

16 Stock 16

17 Images 17

18 Business Materials Board s Badge Need Artwork Here 18

19 Business Cards Need Artwork Here 19

20 Signature For DSBC employees, use the following format for your -signature. HTML/CSS code for format & images <body style= font-family:helvetica, Arial, sans-serif; > <table width= 400 cellpadding= 0 cellspacing= 0 style= font-family:helvetica, Arial, sans-serif; ><tbody> <tr> <td style= font-family:helvetica, Arial, sans-serif; border-right:2px solid #3a8dcc; padding-right:15px; text-align: right; vertical-align:top; valign= top > <table style= font-family:helvetica, Arial, sans-serif; margin-right:0; margin-left:auto; cellpadding= 0 cellspacing= 0 > <tbody> <tr> <td style= font-family:helvetica, Arial, sans-serif; height:40px; vertical-align:top; text-align:center; valign= top align= right ><p><span style= font-family: Helvetica, Arial, sans-serif; font-size: 18pt; font-weight: bold; color: #3a8dcc >BOB OLDER<span><br> </span></span> <span class= space style= font-family:helvetica, Arial, sans-serif; font-size:8pt;letter-spacing: 2px; >President & Founder</span></p> <p><span style= color:#3a8dcc > </span></p> <p><span><a href= BusinessChamber/ target= _blank ><img border= 0 width= 19 alt= Facebook icon style= border:0; height:19px; width:19px src= ></a></span> <span><a href= target= _blank ><img border= 0 width= 19 alt= Twitter icon style= border:0; height:19px; width:19px src= ></a></span> <span><a href= linkedin.com/company/delaware-small-business-chamber target= _blank ><img border= 0 width= 19 alt= LinkedIn icon style= border:0; height:19px; width:19px src= ></ a></span></p></td> </tr> </tbody> </table </td> <td style= padding-left:15px;font-size:1pt; vertical-align:top; font-family:helvetica, Arial, sans-serif; valign= top > <table style= font-family:verdana; cellpadding= 0 cellspacing= 0 ><tbody> <tr> <td style= height:80px; font-family:helvetica, Arial, sans-serif; vertical-align:top; valign= top > <a href= {Logo URL} target= _blank ><img alt= Logo style= height:60px; width:auto; border:0; height= 40 border= 0 src= com/wp-content/uploads/2017/09/dsbc_signature.png ></a></td></tr> <tr><td style= height:45px; font-family:helvetica, Arial, sans-serif; vertical-align:top; text-align:center; padding:0; valign= top > <p><span style= font-family:helvetica, Arial, sans-serif;font-size:14px; ><a href= style= color:#3a8dcc; ><br> </ span></span> <span style= font-family:helvetica, Arial, sans-serif;font-size:14px; ><a href= mailto:connections@dsbchamber. com style= color:#3a8dcc; >connections@dsbchamber.co</a></span><span style= font-family:helvetica, Arial, sans-serif;- font-size:14px; ><a href= mailto:connections@dsbchamber.com style= color:#3a8dcc; >m</a></span> </p></td> </tr> </ tbody> </table></td> </tr> </tbody> </table><table width= 400 border= 0 > <tbody> <tr><br> <td bgcolor= #3A8DCC style= - font-size:13px; font-family:helvetica, Arial, sans-serif; padding:20px; line-height: 16px; > <span style= color: white; >The Delaware Small Business Chamber is an Independent Chamber of Commerce supporting small business throughout the State of Delaware and the surrounding business communities. Our focus is on businesses with 0 to 100 employees and any business that economically supports our local small business community.</span></td> </tr> </tbody> </table></body> 20

21 Social Media Under no circumstances should additional social media accounts be made unless written permission is given from Bob Older and DSBC. To submit a request please contact bob@dsbchamber.com. Google Plus plus.google.com/ Linked In Twitter Facebook Chamber/ 21

22 Social Media Graphics 22

23 Get in Touch P. Fax: Snail Mail 11 Liberty Plaza/Possum Park Mall, Suite F Newark, DE 19711