Home › Blog

Logo file formats: SVG, PNG, PDF, WebP, ICO and when to use each

By the logoBlockchain team · 9 November 2026 · 6 min read

A logo is one design, but it has to live in many places: a website header, a browser tab, an app icon, a printed sticker, an email signature, a slide deck. No single file format is good at all of them. This guide explains the formats you will actually meet — SVG, PNG, PDF, JPEG, WebP, ICO, and EPS — what each is good and bad at, and a small set of files that covers nearly every real-world use.

Vector vs. raster: the one idea you need

Every format below falls into one of two families.

• Vector files describe shapes mathematically: “a curve from here to there, filled with this colour.” They can be scaled to any size — a favicon or a billboard — without getting blurry, and they are usually small. SVG is the main vector format on the web; PDF and EPS can carry vector artwork for print.
• Raster (or bitmap) files store a grid of pixels. They look perfect at their native size, acceptable when scaled down, and soft or jagged when scaled up. PNG, JPEG, WebP, and ICO are raster formats.

The practical consequence: keep your master logo as vector, and export raster files from it at the sizes you need. You can always make a sharp PNG from an SVG; you cannot make a true vector from a small PNG without redrawing it.

SVG

Scalable Vector Graphics is an open W3C standard. An SVG file is plain text (XML) describing paths, shapes, colours, and gradients.

Use it for: website and app interfaces, anywhere a logo needs to stay crisp at different sizes and screen densities, and as the master file you hand to other designers or developers.

Watch out for:

• Text. If the wordmark is live text, it only looks right where the font is available or embedded. For a final logo file, converting text to outlines (paths) is the safest choice; keep an editable version separately.
• Hidden extras. Design tools sometimes export editor metadata, unused definitions, or embedded raster images. Open the file in a text editor or a viewer to check what is inside, and use an optimizer carefully — then treat the optimized file as a new version.
• Where SVG is not accepted. Many social platforms, email clients, and office tools do not accept SVG uploads or do not render them. Have a PNG ready.
• Security on upload. Because SVG can contain scripts, some sites refuse SVG uploads or sanitize them. That is a reasonable precaution, not a flaw in your logo.

PNG

Portable Network Graphics is a lossless raster format with full transparency (an alpha channel). Lossless means saving does not degrade the image.

Use it for: places that need a raster image with a transparent background — social profiles, documents, slide decks, email signatures, marketplaces, app stores, and as a fallback wherever SVG is not supported.

Watch out for:

• Size. Export at the largest size you are likely to need, and separately at the exact sizes used often (for example, square icons). Scaling a small PNG up makes it blurry.
• Edges on dark backgrounds. A logo exported on a white canvas and then “made transparent” can keep a faint light halo around edges. Export with true transparency from the vector source instead.
• File size. PNG is not ideal for photographs, but logos — flat colours, sharp edges — compress well.

PDF (and EPS)

PDF can contain vector artwork, embedded fonts, and print-oriented colour information, and nearly every printer, print shop, and operating system can open it.

Use it for: sending a logo to print shops, sign makers, and merchandise suppliers; brand guideline documents; archival copies that non-designers can open.

Colour: screens use RGB colour; most commercial printing uses CMYK inks, and some brands specify spot colours from a matching system. If print matters, ask the printer which colour setup they want and keep a print version separate from your screen version. Do not assume an on-screen colour will print identically.

EPS (Encapsulated PostScript) is an older vector format still requested by some print and signage suppliers. If someone asks for EPS, provide it, but for most modern workflows a vector PDF or SVG does the same job and is easier to open.

JPEG

JPEG is a lossy raster format designed for photographs. It has no transparency, and its compression produces visible artifacts — blotches and halos — around sharp edges and flat colours, which is exactly what logos are made of.

Use it for: almost nothing logo-related. The only common exception is a photograph that happens to include the logo, or a system that accepts nothing else. In that case, export at high quality on the intended background colour.

WebP

WebP supports both lossy and lossless compression and transparency, and current major browsers display it. For websites it can deliver smaller files than PNG.

Use it for: web performance, when your site or platform serves images in WebP. Use the lossless mode for logos to avoid edge artifacts.

Watch out for: support outside browsers is less consistent — some desktop tools, email clients, and print workflows still expect PNG or PDF. WebP is a delivery format, not a master format.

ICO and favicons

ICO is a container that can hold several small raster images (for example 16, 32, and 48 pixels square) in one file. It is the traditional favicon.ico format and is still widely supported.

Modern sites usually provide a small set of icons rather than a single file:

• an SVG favicon for browsers that support it, which stays crisp at any size and can be simplified for small sizes;
• a PNG or ICO fallback (commonly 32×32 or 48×48) for browsers and tools that do not use the SVG;
• an Apple touch icon, a 180×180 PNG used when someone adds the site to an iPhone or iPad home screen;
• larger PNG icons referenced from a web app manifest if your site can be installed as an app.

At 16 or 32 pixels, a detailed logo turns to mush. Use the simplest form of the mark — often an icon or a single letter — and check it against both light and dark browser themes.

Quick reference table

A minimal logo file kit

For most small brands, this set covers almost every request you will get:

1. Master SVG of each lockup you use (for example horizontal, stacked, and icon only), with text converted to outlines.
2. Large transparent PNG of each lockup (around 2000 pixels on the long side is plenty for most digital uses).
3. Square icon PNGs: 1024×1024 for app stores and profiles, 512×512, and 180×180 for the Apple touch icon.
4. Favicon set: SVG plus a 32×32 or 48×48 PNG or an ICO file.
5. Light and dark variants: a version that works on white and one that works on a dark background.
6. Vector PDF for print, plus a short note with your colour values.

The logoblockchain generator exports SVG files for horizontal, stacked, and app-icon lockups, plus PNG downloads including a 1024-pixel app icon, which is a quick start on items 1–3. Name files consistently, for example brand-horizontal-dark.svg, so nobody has to guess.

Common mistakes

• Only having a JPEG. If that is all you have, the long-term fix is to recreate the logo as vector.
• Using a screenshot as the logo. Screenshots are low-resolution and often include background pixels. Export from the source instead.
• Stretching instead of resizing. Always scale proportionally. A squashed logo is noticeable even when people cannot say why.
• Forgetting dark mode. A dark wordmark on a transparent PNG disappears on dark backgrounds. Ship both variants.
• Re-saving the master. Every re-save can change the file’s bytes. If you timestamp your logo, keep the exact registered file untouched — see SHA-256 for designers for why — and record new exports as new versions.

Pick a master, export deliberately, name files clearly, and keep the originals safe. That covers most of what a professional logo hand-off really is.