Updated
Alpha Mode Inspector: straight alpha vs premultiplied alpha
Diagnose why a transparent PNG or WebP has a black outline, white halo, or matte-colored fringe. Compare the two blend equations, probe exact RGBA edge pixels, and preview a corrected straight-alpha PNG locally.
Open Alpha Mode Inspector ยท Read the straight vs premultiplied alpha guide
Reproduce the outline
Load an image or use the controlled clean-edge, black-fringe, and white-fringe demos. Switch the stored-pixel and renderer assumptions independently to reproduce a double multiply or a missing multiply.
Compare contrasting backgrounds
Inspect the same edge over checkerboard, dark, light, and custom colors. Dark fringes become obvious on light backgrounds; bright fringes become obvious on dark backgrounds.
Probe exact RGBA values
Drag across either preview to inspect a partially transparent texel. The pixel probe reports stored RGBA, normalized alpha, recovered straight RGB, and both composite results.
Preview a targeted repair
Unpremultiply edge RGB or remove a known black or white matte while preserving alpha, then export a browser-generated straight-alpha PNG.
Why do black or white outlines appear around transparent images?
A black outline usually means premultiplied RGB was treated as straight and multiplied by alpha a second time. A white or bright outline can mean straight RGB was treated as premultiplied and added without the required alpha multiplication, or that the edge was contaminated by a white matte.
Pixel values alone do not always prove the original storage mode. An RGB channel greater than alpha disproves valid 8-bit premultiplication, but dark straight-alpha art can still satisfy the RGB-less-than-or-equal-to-alpha constraint. Use the pixel evidence together with exporter and renderer settings.
Straight-alpha and premultiplied-alpha failure modes
| Visible problem | Stored pixels | Renderer expects | Cause | Repair |
|---|---|---|---|---|
| Black or dark outline | Premultiplied RGB | Straight-alpha blend | RGB is multiplied by alpha twice. | Unpremultiply RGB or use premultiplied blending. |
| White or bright outline | Straight RGB | Premultiplied-alpha blend | Full RGB is added without the missing alpha multiplication. | Use straight blending or premultiply at the expected stage. |
| Matte-colored fringe | RGB contaminated by a black or white matte | Either blend mode | Edge RGB already includes the old background color. | Remove the known matte from partial-alpha pixels. |
How to use the Alpha Mode Inspector
- Load the transparent image. Choose a PNG or WebP with antialiased transparency, or open a controlled demo that contains a clean edge, black fringe, or white fringe.
- Compare the same pixels over contrasting backgrounds. Use checker, dark, light, and custom backgrounds. A dark outline is easiest to see over light colors; a white or bright halo is easiest to see over dark colors.
- Match storage with the blend equation. Set whether RGB is straight or already multiplied by alpha, then set what the renderer expects. A mismatch reproduces the double-multiply or missing-multiply failure.
- Probe a partially transparent edge pixel. Inspect stored RGBA, normalized alpha, unpremultiplied RGB, and the output of both blend equations instead of judging only the final preview.
- Preview and export the repair. Unpremultiply RGB or remove a known black or white matte from partial-alpha pixels, compare the repaired edge, and download a straight-alpha PNG for the next tool.
What the browser can and cannot recover
The inspector analyzes browser-decoded RGBA and focuses repairs on partially transparent transition pixels. Browser decoding may normalize color or discard hidden RGB where alpha is exactly zero, so fully transparent texels can require a byte-level PNG workflow. Use Alpha Bleed Fixer when the remaining problem is hidden-RGB padding for filtering and mipmaps.
Alpha Mode Inspector FAQ
What is the difference between straight alpha and premultiplied alpha?
Straight alpha stores the original RGB separately from coverage, so the blend multiplies RGB by alpha. Premultiplied alpha stores RGB after that multiplication, so the blend adds stored RGB directly and only scales the background by one minus alpha.
Why does premultiplied alpha create a black outline?
A black outline appears when RGB that was already multiplied by alpha is treated as straight and multiplied a second time. Partially transparent edge pixels become too dark before they reach the background.
Why does a transparent PNG have a white halo?
A white or bright halo can appear when straight RGB is treated as premultiplied and added without its alpha multiplication, or when antialiased pixels were exported against a white matte before transparency was restored.
Can the inspector prove the alpha mode from pixel values alone?
Not in every image. Any premultiplied 8-bit pixel must have each RGB channel less than or equal to alpha, so values above alpha disprove premultiplication. Dark straight-alpha art can also satisfy that constraint, which makes some files genuinely ambiguous without pipeline context.
Does the uploaded image leave my browser?
No. The image is decoded, analyzed, composited, repaired, and exported locally in the browser. The inspector does not upload the source image.
What does the corrected PNG export change?
The export changes RGB in partially transparent pixels using the selected repair while keeping the alpha channel. Fully transparent RGB may not be recoverable after browser decoding, so the repair is intentionally focused on visible transition pixels.