Staaarter

PNG Object by Color Extractor

Uploads a PNG, picks a target color and a Euclidean RGB distance tolerance, and keeps only pixels within that tolerance at their original color and alpha, making every other pixel fully transparent, isolating whatever object or region in the image was that color, entirely client-side. A free online tool from Staaarter, right in your browser.

Runs locallyUpdated 2026-07-29
By Staaarter Team
editorcolorimagecanvaspng

Overview

Introduction

This tool isolates whatever part of a PNG matches a chosen color, entirely in your browser, by keeping only pixels close to that color and making everything else transparent.

It's the inverse of a typical color-removal tool: instead of deleting a color, it cuts out and keeps exactly the region that color represents.

What Is PNG Object by Color Extractor?

A client-side color-based object extraction tool that scans every pixel, measures its Euclidean RGB distance from a target color, and keeps only pixels within a chosen tolerance, discarding (making transparent) everything else.

Matched pixels keep their exact original color and alpha, so no color shifting or re-tinting happens during extraction.

How PNG Object by Color Extractor Works

For each pixel, the tool computes sqrt((R-targetR)^2 + (G-targetG)^2 + (B-targetB)^2) between that pixel's RGB and the target color's RGB.

If that distance is within the chosen tolerance, the pixel is left completely unchanged; otherwise its alpha channel is set to 0, making it fully transparent while its underlying RGB values are left in place (invisible, but not destroyed).

When To Use PNG Object by Color Extractor

Use it to pull out a specific colored object, logo mark, or highlighted region from a larger image based purely on its color.

It's also useful for quickly generating a mask of 'everywhere this specific color appears' across a graphic.

Features

Advantages

  • Runs entirely client-side; nothing you upload leaves your device.
  • Uses a combined Euclidean distance rather than three independent channel checks, matching shade variation more naturally.
  • Preserves the exact original color and alpha of every kept pixel, with no re-tinting or averaging.

Limitations

  • It can only isolate by color proximity; it can't distinguish two different objects that happen to share the same color.
  • A high tolerance on a busy, multi-colored image can end up keeping unrelated pixels that happen to be numerically close in RGB space.

Examples

Isolate a red logo mark on a white background

Input

A logo with a solid red icon, target #E63946, tolerance 30

Output

Only the red icon's pixels remain opaque; the rest of the image is transparent

A moderate tolerance captures anti-aliased edge shades of the red mark without pulling in unrelated colors.

Isolate a specific highlighted region

Input

A screenshot with a yellow highlight box, target #FFFF00, tolerance 15

Output

Only the yellow highlight box remains visible

A tight tolerance is enough for a flat, deliberately-colored UI highlight.

Best Practices & Notes

Best Practices

  • Pick a target color by sampling the exact shade you want to isolate, then start with a moderate tolerance and adjust from there.
  • Use a lower tolerance for flat digital graphics and a higher one for photographed subjects with natural lighting variation.

Developer Notes

extractPngObjectByColor clones the source buffer and, for each pixel, computes a Euclidean RGB distance against the target color; pixels within tolerance are left untouched, and everything else has its alpha zeroed, returning matchedPixels/totalPixels counts alongside the image for basic feedback on how much of the image matched.

PNG Object by Color Extractor Use Cases

  • Pulling a specific colored logo or icon out of a larger composed image
  • Generating a quick mask of every occurrence of a specific color
  • Isolating a highlighted or annotated region by its distinct color

Common Mistakes

  • Setting tolerance too high on an image with several similar hues, accidentally keeping unrelated pixels.
  • Expecting this to separate two same-colored but visually distinct objects: color proximity alone can't tell them apart.

Tips

  • Zoom into the result afterward to check for stray matched pixels elsewhere in the image before using the cutout.
  • If the result includes unwanted matches, try a lower tolerance or a more specific target color sampled directly from the object you want.

References

Frequently Asked Questions