Transparent PNG

How to make a transparent PNG from any photo.

A transparent PNG is an image whose background pixels have zero opacity, stored in the file’s alpha channel. CRABOY makes one from a photo in your browser: it works out how much of each pixel belongs to the subject and writes that as the alpha, 255 for the subject, 0 for the background and the values between for hair and soft edges.

Last updated 4 min read

A 40 by 24 pixel corner of the Braids on pink cutout at ten times its size: brown strands of hair fading into the transparency checker
  1. 25198%
  2. 24295%
  3. 22287%
  4. 20078%
  5. 17468%
  6. 12449%
  7. 6224%
  8. 3012%
  9. 208%
  10. 125%
  11. 62%
  12. 52%

alpha 255 = solidalpha 0 = clear

Twelve pixels of hair. A corner of the “Braids on pink” cutout on craboy.com at ten times its size, and the twelve outlined pixels with the alpha value stored for each, from 0 to 255. Only the first is close to solid and the last close to clear: a cutout that knew only “subject” and “background” would have nothing between. In the “Hair on black” cutout shown on the site, 9.2% of all pixels are partly transparent.

What “transparent” means in a file

Each pixel of an image with an alpha channel carries four values: red, green, blue and alpha. The alpha sample determines the pixel’s degree of opacity: zero is fully transparent, the largest value fully opaque, and the values between are partly transparent pixels that blend with whatever is behind them.1 In the 8-bit files CRABOY writes, that is 0 to 255.

So a transparent PNG is not a picture with its background painted white or gray; the background pixels are stored with an alpha of 0, and the checkerboard you see in editors is only how they show “nothing here”.

PNG, WebP or JPEG

PNGWebPJPEG
TransparencyYes, full alpha3Yes, lossy or lossless2No alpha channel3
CompressionLosslessLossy or losslessLossy
The shoe cutout, 1280 × 1600 px588 KB97.6 KB125 KB, on white
Use it forAn exact file, for printing or editing furtherThe web: transparency at a fraction of the sizeA white or colored background, where transparency is not needed
Sizes measured on 18 October 2026 from the shoe cutout shown on craboy.com: PNG as the editor writes it (8-bit RGBA, zlib level 4), WebP and JPEG as Chrome 152 encodes them at the editor’s default quality, 95. The JPEG is on white, as JPEG cannot store transparency. Other photos give other sizes; Google reports lossy WebP with transparency as typically three times smaller than PNG.2

Make one in CRABOY

  1. Open the editor and drop the photo: JPEG, PNG, WebP, AVIF, or iPhone HEIC in Safari.
  2. Choose the quality. Studio for hair, fur and soft edges; Max for thin parts on a small subject.
  3. Leave the background transparent. A color or a gradient can be added later without cutting again.
  4. Export PNG, or WebP for a web page. Auto-trim crops the file to the subject, and one switch strips EXIF, XMP and IPTC.

To try it first, the home page cuts out three of your own photos a day at 1K and saves the cutout as a PNG.

When the edge looks wrong

A light or colored halo round the subject

That is color spill: the old background’s color left in the edge pixels. In CRABOY, the Remove tint slider sets how much of it goes: 0 keeps the photo’s own colors, 50 is the default, and 100 restores the subject’s true color on every edge pixel. Only colors change, never the cutout’s shape, and the edge can be set Natural, Crisp or Soft, with Edge shift to move it in or out.

Hair looks cut with scissors

The edge was stored as solid or clear with nothing between. Studio and Max redraw every edge at full resolution in a second pass, so single hairs keep partial values like the 124 and 62 above.

The PNG is very large

PNG keeps every pixel exactly. For a web page, WebP with transparency was about a sixth of the PNG’s size in the measurement above.

The background turns white in another app

Something dropped the alpha channel: JPEG cannot store one, and some apps flatten transparency on import. Save PNG or WebP, and check that the app accepts transparency.

Sources

  1. Portable Network Graphics (PNG) Specification, Third Edition, W3C Recommendation, 24 June 2025; read 18 October 2026.
  2. An image format for the Web (WebP), Google for Developers; read 18 October 2026.
  3. Image file type and format guide, MDN Web Docs; read 18 October 2026.