QUICK STYLE GUIDE

Updated: 5/2022

Download All Logo Files

LOGOS

Click the logo you'd like to download. For center logos download the logo files.

Download All Logo Files

Primary Colors

Slate
R: 26 G: 26 B: 26
C: 0 M: 0 Y: 0 K: 95
#333132

Red
R: 214 G: 81 B: 92
C: 11.69 M: 82.95 Y: 58.14 K: 0.72
#D6515C

Blue
R: 0 G: 99 B: 166
C: 94.51 M: 62.75 Y: 6.27 K: 0.78
#0063A6

White
R: 255 G: 255 B: 255
C: 0 M: 0 Y: 0 K: 0
#FFFFFF

Web Colors

Click the color below to copy the hex color.

Fonts

Follow the link to download or embed your font.

Download Fredoka One

Download Nunito

Fredoka One

Headlines and Callouts
Weight: 400

Aa, Bb, Cc, Dd, Ee, Ff, Gg, Hh, Ii, Jj, Kk, Ll, Mm, Nn, Oo, Pp, Qq, Rr, Ss, Tt, Uu, Vv, Ww, Xx, Yy, Zz

Nunito - Regular

Paragraph and Info
Weight: 400

Aa, Bb, Cc, Dd, Ee, Ff, Gg, Hh, Ii, Jj, Kk, Ll, Mm, Nn, Oo, Pp, Qq, Rr, Ss, Tt, Uu, Vv, Ww, Xx, Yy, Zz

Nunito - Light Italic

Cursive and Special
Weight: 300

Aa, Bb, Cc, Dd, Ee, Ff, Gg, Hh, Ii, Jj, Kk, Ll, Mm, Nn, Oo, Pp, Qq, Rr, Ss, Tt, Uu, Vv, Ww, Xx, Yy, Zz

File Usage Guide

What files to use and when to use them.

Vector Files

A vector file is for anytime your logo is going to be printed on something.

Vector based files usually require professional design software to open, so while VERY important, you won’t be doing too much with them day-to-day. They are unlimited resolution (can be used really big, and really small) and are primarily print and source files.

ai file

.AI file (vector)

Requires Adobe Illustrator (or similar) to open or use. It is unlimited resolution and can be enlarged without image degradation. NOT for web use. Generally cannot be imported into other design software. Largely redundant in light of EPS and PDF files.

ai file

.PDF file (vector)

Can be VIEWED without use of professional design software. Can be viewed on most web browsers, smart phones and tablets but NOT for use “as is” in web site design or as an embedded image. Can be edited (with appropriate software and technical knowledge.)

ai file

.EPS file (vector)

An EPS file of your logo can be imported into other design software. It is unlimited resolution and can be enlarged without image degradation. Can be edited (with appropriate software and technical knowledge) and used as a source file for other file types. Primarily a print file and NOT for use on web. Keep this file safe.

Raster File Types

Generally, a raster file is for use anytime your logo is to be viewed on a monitor or screen.

Bitmap (raster or pixel) files are the ones you’ll generally be using – on your website or in email signatures for example – but are limited in what you can do. You can’t, for example, enlarge the image size of a pixel-based file without it becoming blurry as the individual pixels become noticeable. You can usually reduce it fairly safely.

ai file

.JPG file (raster)

JPG files are primarily for use on monitors and TVs. Used extensively on most web based platforms and applications. Can be compressed to lower file size (and speed up download over the internet) but some image degradation may be apparent. Cannot be used larger than 100% of original image size. ALWAYS features a background color. Difficult, if not possible, to edit.

ai file

.PNG file (raster)

Can feature a transparent (clear) background. Great color accuracy (though blends or gradients may “band” with lower bit rate files.) Cannot be used larger than 100% of original image size though reduces well. Considered universal standard for pristine logo presentation on websites and electronic media, though not fully supported by some platforms (those that don’t usually convert PNGs to JPGs.) Difficult, or not possible, to edit.

Glossary

RGB

(Red, Green, Blue) color mode is for anything that is computer-based design. This includes websites, apps, banner ad and any other design created for electronic use.

CMYK

(Cyan, Magenta, Yellow, Black) color mode is used for print design. This includes logos, business cards, stationary, illustration, packaging and any other designs used for print.

Hex Color Code

A hex color code is a way of specifying color (RGB) using hexadecimal values. The code is generally associated with HTML and websites.

Vector

Vector images are made up of points, lines, and curves that can be infinitely scaled without any loss in image quality.

Raster

Raster images are made up of a set grid of dots called pixels, where each pixel is assigned a color value. Unlike a vector image, raster images are resolution dependent. When you change the size of a raster image, you shrink or stretch the pixels themselves, which can result in a significant loss of clarity and produce very blurry images.

Lossy

Lossy image formats approximate what your original image looks like. For example, a lossy image might reduce the amount of colors in your image or analyze the image for any unnecessary data. These clever technical tricks will typically reduce the file size, though they may reduce the quality of your image.

Lossless

Lossless image formats capture all of the data of your original file. Nothing from the original file, photo, or piece of art is lost—hence the term “lossless.” The file may still be compressed, but all lossless formats will be able to reconstruct your image to its original state.

PNG

PNG is a lossless raster format that stands for Portable Network Graphics. Think of PNGs as the next-generation GIF. This format has built-in transparency, but can also display higher color depths, which translates into millions of colors. PNGs are a web standard and are quickly becoming one of the most common image formats used online.

JPEG/JPG

JPEG is a lossy raster format that stands for Joint Photographic Experts Group, the technical team that developed it. This is one of the most widely used formats online, typically for photos, email graphics and large web images like banner ads. JPEG images have a sliding scale of compression that decreases file size tremendously, but increases artifacts or pixelation the more the image is compressed.

EPS

EPS is an image format that stands for Encapsulated PostScript. Although it is used primarily as a vector format, an EPS file can include both vector and raster image data. Typically, an EPS file includes a single design element that can be used in a larger design.


Designed by Graphic Finesse