How to make a logo background transparent

Remove the white or coloured box behind a logo in your browser, keep crisp anti-aliased edges, and export PNG or WebP at the right size for web, slides and print.

Updated . How guides are checked

Primary sources checked

Use the largest copy of the logo you have, open FileGizmo's background remover, choose Flat colour and add the file. It keys out the background colour, keeps soft edges as partial transparency, and removes the background tint from them. Check it on dark and light colours, then save PNG.

A logo that arrives as a JPG with a white box around it looks wrong on anything that is not white. Removing that box is one of the most common image jobs, and it is also one where photo-trained background removers do worst: logos are flat, thin and full of small counters and gaps. A tool that keys out the flat colour does it better and faster.

Start from the best source you have

Before removing anything, look for a better original:

  • A vector file (SVG, AI, EPS or PDF from the designer) is the ideal. Vectors often already have no background, and they stay sharp at any size.
  • The largest raster copy. A 2000 pixel logo gives a far cleaner result than a 200 pixel one saved from a website. Small, heavily compressed JPGs have blocky edges that no tool can fully repair.
  • Avoid screenshots. They are usually small and may include scaling artefacts.

Remove the background

  1. Open Remove Image Background.
  2. In Cutout model, choose Flat colour, for logos and signatures. Nothing is downloaded.
  3. Drop, paste or choose the logo.

Flat colour takes the background colour from the outer frame of the image, so it works for a white box, a coloured box, or a light grey page. It then keeps every pixel that stands clearly apart from that colour, including inner shapes, and treats the soft pixels along each edge as partly transparent. It also removes the background colour from those edge pixels, which is what prevents the pale rim that makes many transparent logos look cheap on a dark header.

If the logo sits on a photograph or a gradient that changes a lot across the image, Flat colour says the background is not one colour. Use Best edges for that, and expect to touch up the edges by hand.

Check the result on dark and light

On the Background tab, try Studio white, then pick a near-black with the colour picker. Look closely at:

  • Outlines. A faint light or dark rim means some background survived at the edge. The Edges tab’s Feather and Smooth sliders can soften a rim, and Erase can remove a speck.
  • Counters. The holes inside letters such as a, e, o and R should be transparent. Flat colour removes them automatically when they share the background colour.
  • Parts in the background colour. Flat colour removes every pixel that matches the background, wherever it is. A white star inside a green badge on a white page becomes a star-shaped hole. If that shape has to stay white, paint it back with Restore on the Edges tab, or use the logo only on white backgrounds.
  • Thin lines and small text. These should be solid, not broken. If a thin line fades, the source is probably too small or too compressed.

Set the background back to Transparent before saving.

Crop and size it

On the Size tab:

  • Crop to the subject trims the empty canvas around the logo. Subject fills leaves a margin; 90% is a common choice for a logo that will sit next to other content.
  • Square around the subject gives a square canvas, which social profiles and app stores often expect.
  • Custom size sets exact pixel dimensions with the logo centred inside.

Save the large master first, then make the smaller copies from it with Resize Image. Resizing a large, clean master down produces sharper small logos than removing the background from a small file.

Choose the right format for each use

Use Format Notes
Master copy PNG Lossless, keeps transparency, accepted almost everywhere
Website header SVG if available, otherwise PNG or WebP at 2x the display size WebP is smaller; keep a PNG fallback for older tools
Slides and documents PNG Office and slide software handle PNG transparency reliably
Favicon A set of square PNGs The favicon generator makes the common sizes from one square image
Print The vector original Raster logos can look soft when printed large

JPG is not on the list because it cannot store transparency: a logo saved as JPG gets its box back.

Keep the colours right

A transparent logo can still look wrong if its colours shift. Three things cause that:

  • Compression artefacts. A JPG logo often has faint blotches of colour around sharp edges, which survive the cutout. Starting from a larger or less compressed file is the fix; smoothing them by hand rarely looks clean.
  • Colour profiles. Some design software embeds a colour profile that browsers and office software interpret differently. If the brand colour looks off after export, compare the hex value in the original with the exported file, and ask the designer for an sRGB export.
  • A tinted background. If the logo was placed on a light grey or cream box, the edge pixels carry a little of that colour. Flat colour removes the background’s share from them, which is why the edges hold their colour on both light and dark pages.

Name and store the files so they get used

A clean transparent logo is only useful if people pick the right file. A short system prevents the white-box version creeping back into slides and emails:

  • Name files by variant and size, such as brand-logo-transparent-2000.png, brand-logo-white-bg-2000.png and brand-logo-transparent-512.webp.
  • Keep a dark-background and a light-background version if the logo has parts that disappear on one of them, for example black text that vanishes on a dark header.
  • Store the masters in one shared folder with a short readme that says which file goes where.
  • Delete or archive the old JPG so nobody finds it first.

Why a photo model struggles with logos

Segmentation models are trained mostly on photographs of people, animals and objects. A logo’s thin strokes, sharp corners and letters with holes look nothing like that, so these models often fill in counters, round off corners or drop small text. On our own synthetic benchmark, a text logo on white was one of the easier cases for the large model, but thin marks such as a signature were among the hardest. Keying out a flat colour avoids the guesswork entirely, because the question is only how far each pixel is from one known colour.

Privacy

Unreleased logos and client artwork are often under agreement. FileGizmo processes the file inside your browser, and the result page lists any other site the page contacted after you added it, so you can confirm the artwork did not go anywhere.

Tools for this guide

Frequently asked questions

Why does my transparent logo have a white outline?

The edge pixels of a logo are a blend of the logo colour and the old white background. Cutting them out without correcting their colour leaves a pale rim that shows on dark pages. FileGizmo's Flat colour mode takes the background's share back out of those pixels.

Can I make a logo transparent if it has white parts?

Yes, with one extra step. Flat colour removes every pixel that matches the background colour, so a white shape inside a white-background logo becomes transparent too. Bring it back with the Restore brush, or place the logo on white wherever that shape must show.

What size should a transparent logo be?

Keep a large master, at least 1000 pixels across, and make smaller copies from it for each use. Websites usually show a header logo at under 300 pixels wide, so a 2x copy covers high-density screens.

Should I use PNG, WebP or SVG for a logo?

SVG is best if you have the vector original, because it stays sharp at any size. For raster copies, PNG is the widely accepted choice with transparency, and WebP is smaller where the platform accepts it.

Primary references