Your Logo files explained

Updated: Apr 18

After working with a designer to get a logo you love, You receive a number of files and it's a little confusing as to what's what. This post is a simple explanation of the different file types and logo variants you've received and how to best use them.

You receive your artwork in a folder containing more files than you were expecting, and it's full of file types you've never come across. This is a good sign. It means your designer is thinking beyond the aesthetics of the logo and thinking about the the practical application.

A good designer should also have provided you with a variation of 'logo lockups' ( layout versions) So that your logo is versatile enough to use in the real world in all the different situations and spaces you can imagine. ‍ By the end of this post you should feel better informed and confident about unpacking that folder. We will cover what the different file types are are, how they differ and the best use of each file type.




Files Fall Under Two Categories: Vector Files And Raster Files

Vector file types have a file extension of .ai .eps .svg or .pdf

Vector files are bad ass. A vector file can be scaled to any size without any loss of quality. This is because it’s built up from mathematically precise points. Vector files are the type required to get anything professionally printed, large (banners) or small (business cards), If you require edits to the logo or you need design work carried out by another designer, I'll get into more detail but I don't cover .eps (they are basically the same as .svg but less widely used and more of a headache to open so I don't provide eps files unless requested.)

Ai: Adobe Illustrator

Adobe Illustrator is the program most designers will use to create a logo. You will need this software in order to open this file type. The AI file is the original, editable file often referred to as the 'working file' or 'master file'. This file contains all the elements of the logo.  A designer will usually 'outline' the artwork before sending it over. This means that any text in the logo has been turned into a 'shape' which maintains the artwork and avoids issues that can occur when sharing the file. It's good practice for your designer to provide you with the name of any fonts used in your logo especially when the work has not been outlined. Usually in a text document containing notes.

PDF: Portable Document Format

PDF format is widely favored by most designers as it can be universally viewed on any computer with Adobe Acrobat (or another PDF viewer). It’s also possible to preserve illustrator-editing capabilities when saving in this format, meaning it can be opened and modified in the same way an AI can. They’re commonly used for document purposes, but can also be used to share images, including logos.

Why PDFs are another fav:

  • Easy-to-read file format

  • Formatting stays the same on every device

  • Support transparent backgrounds

  • Easy to share

Use PDF files to put your logo on:

  • Print materials (business cards, posters, stickers, and more)

  • Stickers and labels

  • Clothing and swag

How do you open PDFs?

Because it’s an easy-to-read file format, you can download and open PDFs on computers, mobile devices, and tablets. Most browsers allow you to preview the PDF file without opening it in an additional program after download. The ideal program to open a PDF is Adobe Acrobat Reader, which is free to download and comes with most computers.

To edit a PDF logo file, you’ll need Adobe Illustrator or Photoshop.

SVG: Scalable Vector Graphic

SVG files are developed for the web using mathematical formulas rather than individually colored pixels on the page. Vector files will always be crisp and maintain quality — for this reason, you should use them whenever they’re accepted, especially when sending a logo to print.

Why SVG files are my favourite:

  • They can be scaled to any size without loss of image quality (they also look great on retina display)

  • Small file size compared to a PNG or JPG

  • Web-friendly XML language and editable on design software like Adobe Illustrator

  • Support transparent backgrounds

Use SVG files to put your logo on:

  • Print materials (business cards, posters, stickers, and more)

  • Clothing and swag

  • Stickers and labels

  • Websites (not all website builders, including WordPress and Squarespace, accept SVGs. I use webflow because it rocks and webflow DOES accept SVGs)

How do you open SVG files?

You can open SVG files in a browser (Chrome, Firefox, Edge, Safari, Internet Explorer), in Adobe Illustrator, or on another Adobe program like Photoshop and InDesign with an SVG plugin. There are free resources available to open and convert a svg file to a png or jpeg so you can resize it to your required dimensions if you need a specific size raster file.

These files are also great for sending to a designer if you need them to work on your logo.

Raster Files

Raster file types have a file extension of .Jpeg or .PNG (there are other rasterised image types, but for logo design these two suffice. Raster files are built up of squares called pixels. This means that as you increase the size of your image, it will become pixelated or appear to be blurred. This is why a logo design should be created in vector format for the best results. If you provide your designer with specific end use case for your logo (with specific size dimensions) then they can create high quality rasterised artwork and avoid results that appear blurry or pixelated.

JPEG: Joint Photographic Experts Group

Jpeg’s are most commonly seen online. They offer very good compression without overly effecting the image quality, meaning the image is very small in file size, so will load quickly.

PNG: Portable Network Graphics

PNG files can be used for almost any digital purpose. They’re also useful if you need digital images with transparency, such as logos to put on colored backgrounds or on top of other images. This file type is not recommended for print.

Why we like a png:

  • If you compress and decompress the image’s size, it won’t lose its quality

  • Can display millions of colors

  • They Support transparent backgrounds

  • Easy-to-read and access file format

Use PNG files to put your logo on:  

  • Websites and blogs (including your favicon, the icon that shows up in your browser tab)

  • Presentations

  • Letterheads on Word or Google docs

  • Social media profile and cover photos

  • Online shops or platforms like Etsy

  • Images (e.g. to add a watermark)

How do you open PNG files?

You can open PNG files on computers, mobile devices, and tablets, because it’s an accessible, easy-to-read file format. Most browsers also let you view a PNG without downloading the file.

Colour

As vector files are intended for print use they are provided in CMYK colour mode. This is the file for standard 4 colour printing. CMYK refers to the four ink plates used in some color printing: cyan, magenta, yellow, and key (black). Raster files are intended for computer use, so are provided in RGB colour mode. RGB stands for Red, Green and Blue, which are the colours used to make up all the colours you see on your screen.

Logo Variations AKA Lockups

A logo variation is a modified version of your logo that you use in specific instances: sometimes due to size, to vary your look so you aren’t having to place the same logo on every single thing you create and you have options that fit any format or atmosphere. Regardless of which logo you use most often (known as your “primary”)

It’s useful to have each of these variations:

  • Horizontal

  • Vertical or “Stacked”

  • Icon “Brandmark”

  • Wordmark “Logotype”

  • One-Color and Reversed Out

These versions enable you to start building out branding that extends beyond your logo.

Horizontal Logo

An ideal shape for a logo is a horizontal rectangle. That doesn’t mean that the actual shape of the logo needs to be a rectangle, but the live area should be like a wide rectangle. A horizontal logo can be used on your website, corporate invoice and stationary or online and in print where the vertical logo doesn’t fit.

Vertical or Stacked Logo

You’ll need a square or stacked logo variation for when the space on print or web do not accommodate the horizontal logo. Favicons and avatars are two common places where you may need to represent your company or brand with a small, square version of your logo. Your avatar most likely will be used on your social media profiles like Facebook and Twitter.

Icon & Wordmark

It’s beneficial to also have a custom icon or “mark” that acts almost as an extension of your logo. A mark or icon can be used to literally mark your work/client touch points without slapping your whole logo on everything.

Brands with a distinctive wordmark (the typography) and icon (brandmark) benefit from using these elements together or individually to represent their brand. The arrangement of the components of a logo will help your brand work in different media. A stacked, cantered layout works well on labels and signage, but a horizontal layout may be best in the header of a website, in a banner ad, or on the spine of a printed brief or annual report.

The Single-Color & Reversed-Out Logo

This is the ultimate test of a logo’s strength and versatility. A single-colour option is simple and instantly readable. It prepares you for one-colour printing for business cards, letterhead, and packaging. Even if your logo is colourful, it is a good idea to have a solid black and reversed-out white version.

GDLOOK clients receive all the above file types as well as variants of the full logo such as a black and white version, icon version, and /or different layouts for different use in many cases.
Need a custom logo? Get in touch.

About 

I offer branding and design services to the bold and ambitious. I can help you with a wide range of design services from web design to graphic design. I have over ten years of design experience. Get in touch to discuss a custom project or discuss buying a premade design. 

© 2019 GDLOOK All rights reserved 

  • Instagram
  • Pinterest
  • Facebook