File formats – it’s the techy bit of logo design that people can easily get tripped up by. The bit that’s not as fun as getting a fab new logo, but it’s the bit that can make future design projects easy to complete or a total nightmare.
It’s always surprised me that quite a few logo and brand designers don’t explain what logo file formats they’re giving to their clients, what the formats mean and where to use them. These are not things everyone knows and why would they? I’ve also been shocked by the number of businesses that don’t get a basic master logo from their designers.
This guide is to help you and make sure you get what you should from any designer or logo site.
Every logo should be supplied as:
These are the basic file formats EVERYONE should get when you invest in a new logo:
- Vector
- JPG
- PNG
You should always get a number of different logo ‘shapes’ or ‘lockups’:
- Primary logo
- Secondary logo
- Black logo
- White logo
- Icon or favicon
If you’re not being offered these as standard, then be aware of your logo designer – they are cutting corners (or worse, don’t know what they are doing) and you won’t have everything you need for your business.
There are also mini logos or Web Favicons – these aren’t as common, but they’re really useful to have too!
A warning about Photoshop ‘logos’
Photoshop files are not standard formats for logos. Logos should NEVER be designed in Photoshop, and no professional designer worth your hard earned cash would ever suggest that they are. Photoshop simply cannot produce the file type needed for a logo – a vector (see below). Photoshop is an amazing piece of software (I use all the time) but NEVER for logos. If you’re being offered this as an option, be warned, this will cause issues in the future. It will limit how your logo can be used, you won’t be able to scale it up in size at all (only make it smaller). Feel free to message me if you want more details as to why this is such bad practice.
What logos files should you get?
When you get your final logo supplied you should get the following:
- Vector (CMYK, Black, White)
- JPG (RGB, Black)
- PNG (RGB, Black, White)
What do the file formats mean and when and where should you use them?
1. Vector File
There are a few types of vector files – ai, eps, svg.
Stands for:
- .ai = Adobe Illustrator
- .eps = Encapsulated PostScript
- .svg = Scalable Vector Graphic
This is your logo master file. THE most important file to get when you buy a logo.
Any logo should start life as a vector file. If you do not get a vector file when you buy your logo RUN AWAY! Seriously – don’t buy a logo from anyone not willing to give you a vector logo as standard. All the other logo file types, colour variations and lockups can be created from a vector. This is the most important file type to have.
NOTE: Unless you have software like Adobe Illustrator you won’t be able to open the file, but every designer or developer you hire will need this file.
Unlike other file formats, vectors are not made up of blocks/a grid of pixels – they are made of paths. I won’t get too technical but this basically means they can be enlarged to any size without loss of quality.
If you increase the size of png, jpg, gif or Photoshop files they start to look blocky or fuzzy – vectors don’t. This makes them the perfect file for huge billboards and smaller business cards too.
You’ll need your black vector logo if you want to get things like branded pencils, and your CMYK vector logo for things like branded t-shirts or mugs.
Use vectors for:
- These are the files your designer will want.
- Professional printing
- Websites (.svg format only)
- The master file needed to create every other version of your logo
Don’t use vectors for:
- Social Media
- Word/PowerPoint/Excel/Pages/Keynote/Numbers
Colour formats: Anything and everything – CMYK (for print), Pantone (for specialist print), RGB (for online/word/powerpoint)
2. JPG
Stands for: Joint Photographic Experts Group
Jpgs come in various qualities (like low, medium, high) and are generally used for images/photographs, BUT… jpgs are easily compressed without losing quality, so they are a great option to use for your logo on social media. They are also the best files to use in software like Word, PowerPoint (or Pages and Keynote if you’re a Mac user). You get a low file size, but keep the detail.
Use JPGS for:
- Digital (websites or social media)
- Word/PowerPoint/Excel/Pages/Keynote/Numbers
Don’t use JPGS:
- If you need a logo with a transparent background
- You’re getting your logo professionally printed on anything.
Colour formats: Either RGB or CMYK.
What’s the difference between .jpg or .jpeg
Basically nothing – .jpg comes from the inability of older window systems to cope with extensions that were longer than 3 letters. Mac and newer Windows operating systems can handle .jpeg, but it’s now more common to use .jpg to avoid confusion.
3. PNG
Stands for: Portable Network Graphics
Great for logos when you need a transparent background. They retain lots of colour detail but this makes the file sizes bigger too.
Use PNGs for:
- Logos or small images on websites
- When you need a logo with a transparent background
- If you need an image with lots of colour detail and file size doesn’t matter.
Don’t use PNGs for:
- Large website images
Colour formats: RGBA (basically RGB with a transparent section)
4. GIF
Stands for: Graphics Interchange Format
Gifs are commonly used online. They don’t hold as many colours as other file formats, so images can look a little blocky (so don’t use them for big images). Gifs can be animated too.
You don’t actually need a gif version of your logo – if you are supplied a vector, .png and jpg you have everything you need. If your designer does need a .gif version, they can easily create one from your master vector file.
Images (but not logos) are often used as .gif files online.
Use GIFs for:
- Digital banners and buttons
- Animated banners or ads
Don’t use GIFs for:
- Word/PowerPoint/Excel/Pages/Keynote/Numbers
- Anything printed
Colour format: RGB
5. WebP
Stands for: Web Picture Format
WebP files are fairly new and it’s quite probable you won’t have heard of them. They are an alternative to png and jpg images that are great for websites. Why? They have the ability to have transparent backgrounds – very handy when you’re building a website. But the real reason WebP images are becoming more and more common is file size.
Websites need to load quickly – the faster the better – and images are one of the many things that slow sites down. WebP images are one of the smallest file types available. The images in this blog saved as png and jpgs were around 300kb each. The exact same images saved as a WebP were around 37kb. That is a HUGE saving of space and web page load speed. So WebP is great for speed – which means better SEO but also means great for the environment as it takes less energy to load the image into your site.
Use WebP for:
- website images (transparent and full frame)
Don’t use WebP for:
- anything other than on a website (currently!)
So what’s next?
If you’re looking to DIY your own branding, here are some other blogs that I think you’ll find helpful:
- How to tell if you need to rebrand
- What makes a great logo?
- How to find your fabulous – a USP guide
- How to choose great fonts for your brand part 1
- Voiceover Branding Part 1 – What is a Brand?
- Colour Palettes – everything you need for a beautiful voiceover brand
Or – if you don’t want to do it yourself, and you would like me to help uncover your branding for you take a look at my brand packages and get in touch.