Brand Guidelines

Logo File Formats Explained: SVG, PNG, PDF

Shaheer Malik12 min read
ZepixoBRAND GUIDELINES
Logo File Formats Explained: SVG, PNG, PDF
On this page

You finally have a great logo, and then the requests start: send an SVG, a transparent PNG, a print-ready PDF. Understanding logo file formats saves you from sending the wrong file and getting a blurry result on a billboard. It is one of the most practical brand skills you can learn.

This guide is for founders, marketers, and anyone who hands off a logo to a printer, developer, or partner. I will explain each format in plain words, show when to use which, compare them in a table, and lay out the exact set of files to deliver. By the end you will never second-guess a logo request again.

What you will learn

  • The difference between vector and raster files
  • What SVG, PNG, PDF, and other formats are for
  • When to use each logo file format
  • A clear side-by-side comparison table
  • The exact file set to hand off to anyone

Vector versus raster: the key idea

Every logo file is either vector or raster, and this is the most important thing to understand. Vector files describe shapes with math, so they scale to any size without losing sharpness. Raster files are made of pixels, so they blur or pixelate when enlarged beyond their resolution.

The practical rule is simple. Use vector files as your master, and export raster files for specific uses. A vector logo can become any size of PNG, but a small PNG can never become a clean vector.

Vector, stays sharp
Raster, blurs when scaled
Vector files scale cleanly to any size. Raster files lose quality when pushed past their resolution.

SVG: the web vector format

SVG stands for Scalable Vector Graphics, and it is the best logo format for the web. Because it is vector, it stays razor sharp on any screen and at any size. The files are small and the logo can even be styled with code.

Use SVG for your website, web apps, and anywhere on screen where you control the markup. It is the modern default for digital logos. You can read more about it on MDN's SVG reference.

PNG: the transparent raster format

PNG is a raster format that supports transparent backgrounds. That makes it perfect for dropping a logo onto a colored section, a slide, or a social post. It is the most universally accepted everyday logo file.

The catch is resolution. A PNG looks great at the size it was exported, but blurs if enlarged past it. Export a few sizes, including a 2x or 3x version, so you always have one large enough.

PDF: the print and sharing format

PDF can hold vector data, which makes it excellent for print and for sharing with vendors. Printers and designers often ask for a PDF because it preserves crisp edges and exact colors. It opens reliably on almost any device.

Use PDF when you send your logo to a print shop, a sign maker, or a partner's design team. It travels well and keeps quality intact. Think of it as your shareable, print-ready master.

The other formats you may meet

A few more formats come up, mostly in design and print workflows. You will not export these yourself often, but it helps to know them. Here is the quick version.

FormatTypeWhat it is for
EPSVectorOlder print and vendor workflows
AIVectorThe editable Adobe Illustrator master
JPGRasterPhotos, not logos (no transparency)
WebPRasterSmaller web images, broad support
ICORasterBrowser favicons

One thing to avoid is using JPG for a logo. JPG cannot hold a transparent background and adds compression artifacts around sharp edges. Reach for PNG or SVG instead.

When to use each format

Here is the heart of the guide, a quick lookup for any situation. Match the use to the format and you will always send the right file. Keep this table close.

Where you need the logoBest format
Website or web appSVG
Email signature or slidePNG
Social media post or avatarPNG
Print, signage, or merchandisePDF or vector (EPS or AI)
Sharing with a printer or vendorPDF
Browser faviconICO or small PNG
Editing the logo itselfAI or SVG master

A full comparison of logo formats

If you want the formats side by side on the traits that matter, here it is. Use it to understand the trade-offs at a glance. Scalability and transparency are the two that trip people up most.

FormatVector or rasterScales cleanlyTransparentBest for
SVGVectorYesYesWeb and screens
PNGRasterNoYesEveryday digital use
PDFVector (usually)YesYesPrint and sharing
EPSVectorYesYesOlder print workflows
JPGRasterNoNoPhotos, not logos

What to hand off: the complete logo package

When you deliver a logo, give a complete, organized package so nobody comes back asking for more. A good set covers screen, print, and every background. Here is the kit I recommend handing off.

logo-package/
vector/  logo.svg, logo.pdf, logo.eps
png/  logo-1x.png, logo-2x.png, logo-3x.png
light-bg/  dark logo for light backgrounds
dark-bg/  light logo for dark backgrounds
mono/  single-color black and white versions
favicon/  favicon.ico, icon-512.png
README.txt  usage rules and clear space
A complete handoff package covers vector masters, raster exports, color variations, and a favicon.

Include light, dark, and single-color versions so the logo works on any background. Add a short readme or link to your guidelines covering clear space and misuse. For those rules, see our guide on logo usage guidelines.

Want every logo file and rule documented in one place? Open the Zepixo Brand Guidelines workspace and build a logo page that holds your formats, variations, and usage rules.

Exporting tips for clean files

A few habits keep your exported files clean and small. They prevent the common problems of fuzzy edges and bloated downloads. Run through these when you export.

TipWhy it matters
Keep an editable masterYou can re-export any format later
Export PNG at 1x, 2x, and 3xCovers normal and high-resolution screens
Use transparent backgroundsThe logo sits cleanly on any color
Optimize SVG codeSmaller files load faster
Name files clearlyPeople grab the right one without asking

These small steps make your brand easier to work with. A tidy, well-named package signals a professional brand. It also saves you from repeat requests down the line.

How this fits your brand assets

Your logo files are one part of a wider set of brand assets. Colors, fonts, and templates belong in the same organized library. Keeping them together makes handoffs fast and consistent.

Treat the logo package as the centerpiece of that library. Link it from your brand guidelines so anyone can find the right file. For the full checklist, see our guide on the brand assets checklist, and for the basics of the mark itself, our guide on logo design basics.

Color modes: RGB versus CMYK

One more thing trips people up when logos go to print: color mode. Screens use RGB, which mixes red, green, and blue light. Printers use CMYK, which mixes cyan, magenta, yellow, and black ink.

A color that glows on screen in RGB can look duller in CMYK print. That is why printers often ask for a CMYK version of your logo. Keep both, an RGB master for digital and a CMYK file for print, so colors stay consistent across media.

Color modeUsed forNotes
RGBScreens and webBrighter range, the digital default
CMYKPrint and signageMatches what ink can reproduce
Pantone (spot)Exact brand colors in printUsed for precise, repeatable color

Common file format mistakes

A few format mistakes cause most of the headaches. Knowing them keeps your handoffs smooth. Here are the ones to avoid.

MistakeWhy it hurtsFix
Sending JPG for a logoNo transparency, fuzzy edgesSend PNG or SVG instead
Only having one small PNGBlurs when enlargedKeep a vector master
No dark-background versionLogo disappears on dark UIsExport a light variant
RGB logo sent to a printerColors shift in printProvide a CMYK file
Unnamed, mixed filesPeople grab the wrong oneName and fold files clearly

Avoiding these five keeps your brand sharp and easy to work with. Most come down to keeping a vector master and exporting deliberately. A little structure at handoff saves hours of back and forth.

Frequently asked questions

What logo file formats do I need?

At minimum you need a vector master (SVG and PDF) and raster exports (PNG at a few sizes). Add light, dark, and single-color versions for different backgrounds. Include a favicon for browsers.

What is the difference between vector and raster?

Vector files use math to describe shapes, so they scale to any size without blurring. Raster files are made of pixels and lose quality when enlarged past their resolution. Use vector as your master and export raster for specific uses.

Use SVG on the web where you control the markup, since it stays sharp at any size. Use PNG for quick placement on slides, emails, and social posts. SVG is vector, PNG is raster with transparency.

Why should I avoid JPG for logos?

JPG cannot store a transparent background and adds compression artifacts around sharp edges. That leaves a visible box and fuzzy lines around your logo. Use PNG or SVG instead.

What format does a printer need?

Printers usually want a vector file, most often a PDF or EPS. Vector keeps edges crisp at large sizes like signage and banners. Send a PDF as the safe, universal print-ready file.

How do I make a favicon for my site?

Export a small square version of your logo as an ICO file or a 512px PNG. Browsers use it as the small icon in tabs and bookmarks. Keep the design simple so it reads at tiny sizes.

Keep a vector master, export the rest as needed, and hand off one organized package so your logo always looks sharp wherever it lands.

S

Shaheer Malik

Founder of Zepixo — building the whole brand studio in one tab. Try Zepixo →

Related posts