"Make an image transparent" means one of two different things, and the right steps depend on which you want. Either you want a transparent background — the subject kept, everything behind it erased to see-through pixels — or you want the whole image made see-through, lowering its opacity so a watermark or overlay lets the layer beneath show through. The first is a background-removal job that ends in a PNG; the second is an opacity edit inside a photo editor. Below is the exact workflow for each, plus the one rule that ties them together: transparency only survives in a format that supports an alpha channel, so you must save a PNG or WebP — a JPEG cannot hold it.
First decide which "transparent" you need
- Transparent background. You want to lift a product, logo, person, or signature off its background so it can sit on any color or scene. The result is a cutout on see-through pixels. This is the common case for e-commerce photos, logos, and design assets.
- See-through (reduced opacity) image. You want the entire picture — background and all — to become semi-transparent, so it works as a faint watermark, an overlay, or a background behind text. Nothing is erased; the pixels just get an opacity below 100%.
Pick the one that matches your goal before you open any tool — the two paths do not overlap, and doing the wrong one wastes time.
Make the background transparent (the common case)
An AI background remover can provide an initial cutout; a manual editor lets you correct the selection. Export the reviewed result as a transparent PNG.
- Open an AI background remover such as ShotBG and upload your image (PNG, JPG, or WebP).
- Let it detect the subject and remove the background. ShotBG processes one still image at a time and exports PNG. Place the cutout on a new background in an external editor, or use Custom AI backgrounds (paid plan) for a generated scene. Large inputs are resized, so check the downloaded dimensions.
- Download the result. The file is a PNG with real transparent pixels — check it on a colored surface, not a white page, to confirm the background is genuinely gone.
Results depend on the source photo: even lighting, clear separation between subject and background, and simple edges give the cleanest cut. Hair, transparent glass, and low-contrast edges may still need a manual pass — no automatic tool guarantees a perfect edge on every image.
For hand-corrected edges, use a manual editor. Photoshop's one-click Remove Background, Object Selection, and layer masks give full control — the remove background in Photoshop guide walks through it. If you want a free desktop option, the remove background in GIMP tutorial covers selecting the subject, adding an alpha channel, and exporting a transparent PNG. For the full picture of how removal fits together, see how to remove background from an image.
Remove a still-image background with AI. Check current availability in the uploader; download in the same browser without signing up. Review the edges before publishing.
Make the whole image see-through (lower its opacity)
This is a different job — you are not erasing anything, just reducing the opacity of the entire layer. ShotBG does not have an in-app opacity slider; it removes backgrounds. To lower a whole image's opacity, use a layered editor:
- Open the image in a layered editor — Photoshop, GIMP, Photopea (free, in-browser), or Canva.
- If the layer is locked as a "Background," unlock it first (in GIMP, add an alpha channel via Layer → Transparency → Add Alpha Channel).
- Lower the layer's Opacity in the Layers panel to the level you want — adjust it while viewing the image over its intended background so text and details remain readable.
- Export as PNG (or WebP) so the reduced opacity is preserved. Flattening to JPEG will merge it onto a solid color and lose the see-through effect.
If you want the image see-through and the background gone — a faint transparent-background watermark — remove the background first (section above), then lower the cutout's opacity in the editor.
Save it right or the transparency disappears
This is where most transparent images go wrong. The pixels can be perfectly transparent inside the editor and still come out solid once you save:
- Use PNG or WebP. Both support an alpha channel. A JPEG cannot store transparency and will fill the see-through areas with a solid color (usually white or black). The format comparison below explains the differences.
- Keep an editable layered original. Flattening onto an opaque background removes transparency. Export a separate PNG and check the resulting pixels; merging layers and flattening are not equivalent in every editor.
- Verify on a colored surface. Open the file over a bright background or in a viewer that shows a checkerboard. A white preview page can hide the fact that the background is still solid white.
- Watch file size on WebP. WebP supports transparency. Compare exported size and edge quality for your image and check whether the destination accepts it.
Alpha channels and image formats
An alpha channel records opacity alongside color. In an 8-bit alpha channel, 0 means fully transparent and 255 means fully opaque; intermediate values let backgrounds show through. RGB color values alone do not describe transparency. A PNG can contain only opaque pixels, so its extension does not prove that its background was removed.
| Format | Transparency | Practical use |
|---|---|---|
| PNG | Full alpha, including partially transparent edges | Still cutouts, graphics, and logos |
| WebP | Alpha, including partial opacity | Web graphics where the destination accepts WebP |
| GIF | A transparent palette entry, without partial opacity | Simple animations; curved edges may look rough |
| AVIF | Supports alpha | Web images after checking destination support |
| SVG | Supports transparent areas and opacity | Vector logos and icons; keep the original vector file |
| JPEG | No alpha channel | Photos with an intentionally solid background |
These are format properties, not ShotBG export options. ShotBG accepts PNG, JPEG, and WebP inputs and downloads PNG; convert to other formats in a separate editor. For animation, see how to remove a background from a GIF. GIF transparency cannot preserve the partially transparent edge pixels of a PNG sequence; APNG or animated WebP may be alternatives when the destination supports them.
Manual selection: keep the subject, remove the background
Keep an editable original before changing pixels. The selected area determines what a delete command removes.
Photoshop
- Open a working copy and unlock the background layer if necessary.
- Use Select → Subject, then refine the selection in Select and Mask.
- With the subject selected, add a layer mask that keeps the selection visible and hides its surroundings. If you choose deletion instead, invert the selection first so the background is selected, then clear it. Do not delete the selected subject or the whole layer.
- Inspect the mask on contrasting backgrounds and export a PNG with transparency enabled.
The Photoshop tutorial gives the fuller workflow.
GIMP
- Duplicate the image layer, hide the original, and add an alpha channel to the working layer via Layer → Transparency → Add Alpha Channel if it does not already have one.
- Select the background with Fuzzy Select or Select by Color, or use a subject selection for a more complex outline.
- For deletion, confirm the background is selected. If the subject is selected, choose Select → Invert, then Edit → Clear. For a reversible mask, keep the subject selected and initialize the layer mask from that selection instead.
- Keep the layered XCF project and export a separate PNG. Reopen it to check the transparent regions.
The GIMP 2.10 and 3.0 guide explains the selection methods and version-specific mask commands.
Canva
If your account offers background removal and transparent PNG export, remove the background in the image editor, inspect the result, and enable the transparent-background option when downloading PNG. Downloading a PNG without that option does not establish transparency. Check the options available in your account before relying on this workflow.
Diagnose transparency and edge problems
- White or colored halo: edge pixels may retain the original background color. Refine the mask and inspect the result on both dark and light backgrounds. Color decontamination or defringing in an external editor may help, but compare against the original so you do not remove real product detail.
- Black or white viewer background: a viewer may display transparency against a solid canvas. Place the image over a colored layer in an editor before assuming the file is opaque.
- Jagged GIF edges: GIF cannot retain partial opacity along a curve. Use a format with full alpha if your destination supports it.
- Transparency disappears after saving: check whether you exported JPEG, included an opaque background layer, or disabled transparent export. Re-export from the editable original.
- A checkerboard appears on every background: it may be painted into the image itself. A screenshot of a transparency preview is not a transparent cutout.
Do not use file size as a transparency test. Small and large PNGs can both be opaque or transparent.
Check actual pixels in a browser
Canvas returns RGBA data even for an opaque source, so checking whether a pixel has four channels is not a transparency test. Check whether any alpha value is below 255 instead:
const img = new Image();
img.onload = () => {
const canvas = document.createElement('canvas');
canvas.width = img.naturalWidth;
canvas.height = img.naturalHeight;
const ctx = canvas.getContext('2d');
if (!ctx) return;
ctx.drawImage(img, 0, 0);
const pixels = ctx.getImageData(0, 0, canvas.width, canvas.height).data;
let hasTransparentPixels = false;
for (let i = 3; i < pixels.length; i += 4) {
if (pixels[i] < 255) {
hasTransparentPixels = true;
break;
}
}
console.log({ hasTransparentPixels });
};
img.src = '/image.png';
Use a same-origin image, or configure CORS for a remote image; otherwise the browser can prevent reading canvas pixels. The check detects partially or fully transparent pixels, not whether the intended background was removed correctly. Inspect the image as well.
Use transparent images on the web and in layouts
A transparent image shows whatever is behind it. CSS does not remove an opaque background already baked into a file:
<div style="background-color: #183c2c">
<img src="logo-transparent.png" alt="Company logo" />
</div>
<picture>
<source srcset="product.webp" type="image/webp" />
<img src="product.png" alt="Product cutout" />
</picture>
Preview cutouts on white, dark, colored, and photographic backgrounds. Fine pale edges may disappear on white but become obvious on dark layouts. Keep a vector original for logos when available, plus separate raster exports for destinations that require them. A raster cutout does not become a vector logo simply by saving it inside an SVG file.
For product listings, confirm the current platform and category requirements. A transparent PNG may expose a store theme's background; a destination requiring solid white needs a white composite instead. The white-background guide covers that separate step. Social platforms may flatten or convert uploaded images, so preview the uploaded result rather than assuming alpha survives. For print, ask the printer about pixel dimensions, physical size, color handling, and file format; ShotBG does not offer print-ready export.
Optimize without losing the intended edges
Keep the original image and a layered editing file. Optimize a separate delivery copy:
- Resize to the dimensions needed by the destination, keeping enough detail for its display size.
- Compare PNG and WebP if both are accepted. Inspect edges and translucent areas after conversion; a smaller file is not automatically a better result.
- Palette-based PNG can suit simple icons, but limited colors can change gradients or fine edges. Check a trial export before adopting it.
- Compression tools may alter color or alpha values. Reopen their output over contrasting backgrounds.
- Remove unnecessary metadata only after considering privacy and display needs. Keep color information required for a consistent appearance.
Repeated lossless PNG saves do not inherently degrade the image or inflate it; dimensions, content, metadata, and encoder settings determine the file size.
Common questions
- Can I make a JPG transparent? Not while it stays a JPG. Open it, make the background transparent or lower its opacity, then save as PNG or WebP — the transparency lives in the new file, not the JPG.
- Which format for a logo? PNG. Logos need crisp edges and a transparent background so they sit on any color; PNG's lossless alpha is the standard.
- Why does my "transparent" image show a white box? It was saved as a JPEG, or it was flattened before export. Re-export as a PNG without flattening.
- Can ShotBG make an image semi-transparent? No — ShotBG removes backgrounds and returns a transparent-background PNG. Whole-image opacity is a layer edit you do in a photo editor.



