Creating a Style Guide for Your Brand: An In-Depth Look at Names, Logo Files, Fonts and Colors

Your brand identity is more than just your logo. 

Although it’s true that having a clear and simple logo that has a styled font will go a long way in branding your company, you must define your company more than that. You won’t always need or want to use your whole logo and this is why having a cohesive brand identity will make sure that you’re recognizable even without it.

Define your logo signature, brand colors, brand fonts, and other design elements to communicate the look and feel of who you are. According to a Lucidpress article, there is an average increase of 33% in revenue because the brand consistently presented itself.

80% of people remember what they see, compared to 10% of what they hear and 20% of what they read. Make people SEE what it is you do.

Let’s talk about naming brands, logos and file types, fonts, and color spaces.

Your company name

If you already have a company name, don’t skip over this section. Even if it requires a rebrand, it will be worth it if it is confusing, hard to remember, or stale. Your company name needs to be easy to understand, memorable, and universal. If people can’t pronounce it, spell it, or understand it over the phone, chances are it isn’t “sticky” enough to be memorable.

Survey people that are your ideal customers, and see if they have an opinion about your company name. See if they can remember it, know what it is about, spell it without being told. These are key indicators that you have a good name to build a brand upon.

There is nothing wrong with rebranding your company if you come up with a better solution. Yes, it will take some upfront investment to change things over, but in the long run, having a name that people can remember, makes your branding efforts so much more valuable and cost-effective.

Common brand name no-nos

Stay away from acronyms or other codes in your name. A lot of my clients have had names that no longer represent what they do. At one time it might have made sense; other times, it was confusing from the very beginning.

When receiving feedback, keep your ears, mind, and heart open. Keep your guard down and be mindful of what they are trying to communicate to you.

Listen to what they have to say and give them space when they pause to gather their thoughts. They may have never been able to say your name correctly or even remember it let alone spell it. They may be able to do all of those things, but honestly have no idea why you chose it and how it relates to the work you do.

How to know if you have a good brand name

If it is a good fit, then own it and run with it. But doing your due diligence now can save you a lot of heartaches later.

If you decide to rebrand, run a brainstorming session and write a couple of dozen name ideas out first. Cross off anything that doesn’t resonate or fit what you do, and narrow down what feels best.

Remember: A brand name has to be easy to spell, say, read and hear. So make sure it passes all those tests before committing to something. Keep it simple and keep it memorable.

Fonts matter

Choosing your font is more than choosing something that looks cool or trendy. Your font communicates who you are and what it’s like to work with you.

Classic, trustworthy, ageless = serifs. Serifs are those little elements on the end of the letters that make it feel more classic like a Times New Roman font. Some of my favorite serif fonts are Merriweather, Georgia, and Garamond.

Modern, contemporary, new, and fresh = sans-serifs. These are fonts sans (or without) serifs, like Arial or Helvetica. Some of my favorite sans serif fonts are Helvetica, Futura, Montserrat, and Bebas.

Icons and Emblems: Social, T-Shirts, and Other Swag

Icons or emblems, represent your brand in tight spaces. Think of social media profile photos, letterhead, or t-shirts. They’re simple and easily recognizable. Some great examples are the Nike Swoosh, Apple’s Apple, or Shell Gas Station’s Shell. Whether we like these brands or not, these icons are very recognizable.

Rule 1: Simple is better.

You want your icon to be so simple that a kid could draw it from memory. Another good goal is to have a logo simple enough that it could be embroidered.

Rule 2: Does it pass the Black and White Test?

Create your logo in black and white versions and then ensure the logo can be reversed and still communicate the same messaging. If it doesn’t pass the black and white test, continue working it until it does.

Non-Negotiable Logo Versions

Please, please, please: Do not go to all the trouble of designing a logo and then drop the ball when it comes to making it available for use.

When the talented designer you hired completes your logo and you sign off on the final, glorious piece, make sure to request both raster and vector versions of your logo.

Raster files

Raster versions are great for screen use and are usually measured in dots per inch or DPI. At its core, the term raster means that if you take a small photograph and enlarge it, it will become more and more pixelated – i.e. blurry – until it reaches the point where it is unrecognizable. As such, they don’t look very good when scaled up to much larger than the original design. Other times, you are stuck with a white box around them like you see in a lot of JPG logos. No bueno.

The best raster file type is a PNG with a transparent background. PNG (pronounced PEE-en-JEE) stands for Portable Network Graphic, and it is the most frequently used uncompressed raster image format on the internet. A PNG is used for web page navigation elements, graphics, and any type of image with sharp edges. In short, wherever transparency, good compression, details, and clear boundaries of the image are necessary. Make sure you’re able to get a true PNG with a transparent background.

A JPG (or JPEG) stands for Joint Photographic Group and is a raster format often used for photographs on the web. JPG files are web-friendly because the files are typically smaller in file size.

The downside to JPGs is that the original quality of the image is decreased as it is compressed to keep the image size small. JPGs become blurry when used for high quality printing. Benefits of JPGs include: they have a small file size, are compatible with almost all devices and software, and high resolution JPEG images are vibrant and colorful.

Within the past couple of years, a new file format has become more prevalent called WebP. This format provides superior lossless and lossy compression for images on the web. Using WebP, webmasters and web developers can create smaller, richer images that make the web faster. For comparison, WebP lossless images are 26% smaller in size compared to PNGs while still supporting transparency. I imagine this file format is going to become more and more prevalent in the next few years.

Vector files

The #1 file type you need for your logo is a vector file. Vector files are images that are built by mathematical formulas that establish points on a grid. This means they can infinitely scale in size without losing resolution – making vector files more versatile for certain types of tasks than raster files.

Common Vector file extensions are: 

  • .ai (Adobe Illustrator)
  • .eps (Encapsulated PostScript; an older filetype that doesn’t support transparency the same way .ai files do)
  • .pdf (Portable Document Format)
  • .svg (Scalable Vector Graphics)

If you were ever going to print your logo on a large scale, it is imperative to have a vector file. If you’re having a designer create a logo for you or you’re creating a logo for yourself, you MUST have a vector file to protect your brand in the long run to future proof your investment.

You can always turn a vector version into a raster version, but it is much harder the other way around. Asking your designer to send you a vector format of your logo is standard practice and make sure you keep the file somewhere easy to access for you to send out whenever necessary. Every designer you work with in the future – from media outlets to partners – is also going to want a vector version of your logo.

Brand Colors

According to a study from University of Loyola, color increases brand recognition by up to 80%. Yaow! That is something to not take lightly.

Your brand color palette is used for your logo, signature, and any branding materials including, but not limited to, your website, brochures, social media posts, and ads in videos.

Define two to five colors max and know what their color codes are for print and screen.

Color theory

Knowing just a little bit of color theory can go a long way when defining your brand colors. So let’s dig into that a little bit. The colors you choose tell the story.

  • Yellow evokes clarity, warmth, and optimism.
  • Orange evokes cheerful, confident, friendly.
  • Red evokes bold, useful, excitement
  • Purple evokes imaginative, wise, creative
  • Blue evokes trust, dependable, strength
  • Green evokes health, growth, peaceful
  • Gray evokes calm, neutral, balance
  • Rainbow evokes diversity, multifaceted, all-encompassing

So who are you? How do you want your customers to feel when they see your brand or visit your website?

Color Spaces

We don’t need to dive too deep into color spaces, mostly because we leave that for the trained professionals. Which, if I haven’t mentioned it, you should be investing in your design work.

Color spaces are a way to describe and measure color values, so we can keep colors looking consistent from device to device, computer to computer, digital to print.

The reason you should care about color space at all is that you get a better understanding of why something doesn’t look right when you see it on a screen vs. printed on your home printer vs. printed on a thousand brochures by a printing press.

If you hold a printout next to your screen, it won’t match for a handful of reasons. Such as: how calibrated your monitor is or what temperature of light is bouncing onto the piece of paper. If you have warm tungsten desk lamps pointing at it your colored paper will look different than if you held it under white-almost-green fluorescent light. So, just remember that as you are choosing your brand colors.

For example, Pepsi uses red and blue in their brand colors, and that red and blue look the same on their can, as on their vending machine, TV commercials, and on print ads, so defining these colors once can influence the design process throughout.

The four kinds of color languages that you should know: RGB, CMYK, HEX, and Pantone.

There is nothing more infuriating than getting a box of 1,000 postcards in the mail from your printer with colors that look nothing like you expected. The consolation is that you have a supply of 1,000 coasters to protect your wood table from your iced tea. And, just as useful, something sturdy to fold in half and wedge under a wobbly table at your local dive bar.

Rest assured that most of the time the printing press will send you a proof for your approval. Make sure you get a good look at it in person before signing off on moving ahead with the full print run.

RGB (red, green, and blue): what we see on every screen in the world including digital devices and home printers. RGB is denoted by a single number for each amount of Red, Green, and Blue. (37,95,145)

CMYK (cyan, magenta, yellow, and black): the “color space” that printing presses use. So, if you are having posters or brochures printed by a press, or if you are going to run an ad in a magazine or local newspaper, then you’ll want to make sure that your design is in the CMYK color space. CMYK is denoted by a single number for each amount of Cyan, Magenta, Yellow, and Black. (91,64,20,4)

HEX: becoming the go-to way to keep your colors consistent in the consumer space. They’re denoted by using the “#” symbol and then a combination of six numbers and letters. Hex codes are denoted by a combination of numbers and numbers. (#255f91)

Pantone (or PMS): a color space used for printing presses and clothes printing. Pantone is a universal standard color code so that the color on one type of material matches that color on a different type of material.

Defining Your Color Palette

If you’re just starting in defining a color palette I recommend looking at what other color palettes are out there for brands that you want to be associated with.

You can reference places like Pinterest, magazines, websites, TV commercials, etc. Keep a collection of your favorite color combinations. When all else fails, keep it pretty neutral and add one splash of color.

Creating Your Style Guide

Once you have your color pallet defined then you can iterate on your logo and materials with different combinations of those colors. By having at least four, you have flexibility in how you want to present yourself in certain ad campaigns, seasons, or materials. Stay organized! Create a folder on your computer that has two folders inside of it. One that says “for print” the one that says “for screen.”

Having these easily accessible will make your life way easier when promoting your business. In those folders, you should also include a style guide that can help designers, co-workers, and collaborators accurately represent you.

This style guide PDF document should show:

  • Your icon
  • Logo signature
  • Color codes for your brand colors
  • Fonts that you use
  • Any additional approved elements that keep your brand messaging consistent

In this folder, you might also add your hero images, and additional key brand images formatted as big (for printing) and small (for screen) versions.

For the big versions, have them as big as you can. 5000px wide or more. And for small versions, 2000px wide is still pretty big, but you can use it for any size screen and it will still look sharp.

So when you have a trade show booth design you can use these colors and logos and fonts, and when you hire a video producer to make social media video ads they can use the same colors and fonts and logos making it all look cohesive, or dare I say… Unified! Doesn’t that feel amazing?

Download a copy of our free team marketing worksheets here. Want to learn even more? Check out our book and video course, Unify Your Marketing.