Are my images uploaded anywhere during the check?

No, the analysis runs entirely in your browser using the canvas API. The image is decoded and its alpha channel is sampled locally — no network request is made.

Why does JPEG always report no transparency?

JPEG has no alpha channel — every pixel is fully opaque by definition. If you need transparency, the file must be PNG, WebP, GIF, or SVG.

What is the difference between fully transparent and semi-transparent?

Fully transparent pixels (alpha = 0) are invisible. Semi-transparent pixels (alpha between 1 and 254) are partially see-through; they are responsible for smooth anti-aliased edges around a logo, soft shadows, and feathered cut-outs.

Why is the working canvas only 200 × 200 px?

Sampling a smaller canvas keeps the per-pixel work bounded so the tool stays responsive on phones and low-end laptops. The presence or absence of transparency is well-detected at that resolution; you do not need every pixel.

How do I add transparency to an image that does not have it?

You need an image editor that supports alpha channels — Photoshop, Affinity Photo, GIMP, or Figma. Remove the background, then export as PNG or WebP. JPEG output will always discard the alpha channel.

Transparent Background Checker

Detect whether an image has a transparent background and count its alpha pixels.

Written by Golam Rabbani, Founder & Lead Engineer

This interactive tool requires JavaScript. Read the formula and worked example below; you can compute the result by hand.

How to use this transparent background checker

Choose an image file (PNG, WebP, or GIF — formats that support transparency).
The preview renders the image over a checkerboard pattern so transparent areas are obvious.
Press "Check Transparency" to scan a downsampled copy and count alpha pixels.
Read the report: fully transparent count, semi-transparent count, and sampling resolution.
Use "Reset" to clear the result and check another image.

About this transparent background checker

A transparent-background checker tells you whether an image has any transparency, and if so how much. The classic case is verifying that a logo really has a transparent background before placing it over a coloured hero image — many product photos and free icons look transparent in a thumbnail but actually have a solid white background that becomes a visible rectangle on a non-white surface.

This tool renders the uploaded image over a CSS checkerboard so transparent and semi-transparent areas are immediately visible to the eye. Then on "Check Transparency" it decodes the file with createImageBitmap, draws it onto a 200 × 200 px working canvas, and walks the resulting alpha channel — counting fully transparent (alpha = 0) and semi-transparent (0 < alpha < 255) pixels. The 200 × 200 cap bounds the per-pixel work to ~40,000 reads regardless of the source size, which keeps the tool fast on phones and avoids INP regressions.

Everything happens locally in your browser. The image is decoded, sampled, and reported on inside the tab — no network request occurs and your file never leaves the device.

As a worked example, a properly-prepared PNG logo will report something like "Fully transparent pixels: 18,400 of 40,000 sampled · Semi-transparent pixels: 1,200" — large counts in both columns confirm a clean alpha channel with smooth anti-aliased edges. A "transparent" logo that actually has a white background reports zero in both columns: a sure sign the file needs to be re-exported with proper alpha.

FAQ

Are my images uploaded anywhere during the check?: No, the analysis runs entirely in your browser using the canvas API. The image is decoded and its alpha channel is sampled locally — no network request is made.
Why does JPEG always report no transparency?: JPEG has no alpha channel — every pixel is fully opaque by definition. If you need transparency, the file must be PNG, WebP, GIF, or SVG.
What is the difference between fully transparent and semi-transparent?: Fully transparent pixels (alpha = 0) are invisible. Semi-transparent pixels (alpha between 1 and 254) are partially see-through; they are responsible for smooth anti-aliased edges around a logo, soft shadows, and feathered cut-outs.
Why is the working canvas only 200 × 200 px?: Sampling a smaller canvas keeps the per-pixel work bounded so the tool stays responsive on phones and low-end laptops. The presence or absence of transparency is well-detected at that resolution; you do not need every pixel.
How do I add transparency to an image that does not have it?: You need an image editor that supports alpha channels — Photoshop, Affinity Photo, GIMP, or Figma. Remove the background, then export as PNG or WebP. JPEG output will always discard the alpha channel.