Create WebP Alpha Mask
Extract alpha channel from WebP as grayscale or 1-bit mask. Photoshop or VFX convention. PNG/WebP/JPEG. Free, client-side.
Extract the alpha channel of a WebP as a grayscale or 1-bit mask. Photoshop convention by default (white = opaque, black = transparent); invert checkbox flips to VFX luma-matte convention. WebP magic-byte validated.
Original / Alpha mask
How to Use Create WebP Alpha Mask
- Drop a WebP file. RIFF/WEBP magic bytes are validated - non-WebP files rejected with specific error.
- Pick mode. Grayscale: alpha value → R=G=B (anti-aliased edges become gray). Threshold: alpha > slider → 255, else 0 (hard cutoff, no anti-aliasing).
- Toggle Invert to switch convention. Default (Photoshop): white = opaque, black = transparent. Inverted (VFX luma matte): white = transparent, black = opaque.
- Pick output format. PNG is standard for masks (lossless, broadly supported). WebP is smaller but newer. JPEG is bad for sharp 1-bit edges (DCT ringing) but fine for grayscale.
- Stats show transparent-pixel percentage. Copy data URI or download. Filename includes source name + mode + dimensions.
Frequently Asked Questions
What’s the standard convention for alpha masks?
The most common convention (used by Photoshop, GIMP, Krita, web design) is: white = opaque, black = transparent. This matches “the mask shows you what’s visible”. The VFX industry sometimes uses the inverted convention (black = visible, white = remove) for luma-key matte compositing. Use the Invert checkbox to switch.
What’s the difference between grayscale and threshold mode?
Grayscale preserves anti-aliased edges: alpha = 128 produces gray 128. Great for compositing where soft edges matter. Threshold forces every pixel to fully opaque or fully transparent based on the threshold slider. Great for hard-edge cutouts (logos, text) or cutting paths.
What if my image has no transparency?
The mask will be entirely white (or entirely black if inverted). The tool’s info toast warns when this happens. If you wanted a mask from a non-transparent image, you probably want luminance-based extraction instead – try the Silhouette tool (luminance mode) for that.
Why is PNG the default output?
PNG is the standard for masks in image editing workflows. It’s lossless (preserves exact pixel values, critical for masks), broadly supported, and reasonably-compressed. JPEG introduces DCT artefacts that corrupt mask edges. WebP is great but newer; many image-pipeline tools still expect PNG.
What’s “magic-byte validation”?
Every WebP file starts with bytes R-I-F-F at offset 0 and W-E-B-P at offset 8. The tool reads the first 12 bytes and checks both markers. This is stronger than MIME-type or file-extension checking – those can be wrong or missing.
Why might WebP/JPEG output downgrade to PNG?
Old browsers (Safari pre-14, embedded WebViews) can’t encode WebP via canvas. If toDataURL('image/webp') returns a PNG data URI, the tool detects this, falls back to PNG, and shows you an info toast.
What’s in the “transparent pixel %” stat?
Percentage of pixels with alpha < 255. 0% means a fully-opaque image (alpha mask is uniform). 100% means a fully-transparent image (mask is uniform the other way). Useful for sanity-checking your input.
Does the threshold slider have a “right” value?
128 (the midpoint) is a reasonable default. For anti-aliased edges, try lower values (64-96) to include more soft edges as opaque. For only the hard core of the shape, try higher (192-220). It depends on what you want the mask to represent – there’s no universally correct value.
What’s in the download filename?
Format: {source-stem}-alpha-mask-{mode}{-inverted}-{w}x{h}.{ext}. E.g., portrait-alpha-mask-grayscale-1920x1080.png or with invert: portrait-alpha-mask-threshold-inverted-1920x1080.png.
Is anything uploaded?
No. All image processing happens through the Canvas API inside your browser – nothing is sent to a server, logged, or stored, and the tool keeps working offline once the page has loaded.