How the color key works
Drop a picture, click the color you want gone, download a transparent PNG. Your file is decoded in this tab, rewritten one pixel at a time, and encoded again by the same browser. No copy of it goes anywhere.
The picker opens with a guess already made. It reads the one-pixel ring around the outside of your picture, bins those colors five bits per channel, and keys the most common bin, because a border is mostly made of backdrop. Clicking anywhere on the preview swaps that guess for the color under your finger.
Matching runs in Oklab rather than in RGB. Take #ffffff against #d7d7d7 and #282828 against #000000: both pairs sit 40 RGB units apart and they look nothing alike, and Oklab scores them 0.121 and 0.277. One tolerance setting then behaves the same on a white sweep as on a charcoal one.
Two details separate this from the magic wand in an old photo editor. Pixels near the boundary fade along a ramp instead of snapping to on or off, so the anti-aliased rim of a logo keeps its softness. And the removal spreads inward from the frame's border, four neighbors at a time, so the tool only takes backdrop it can walk to: the white inside an "o", the whites of an eye and the highlight on a bottle all survive. Enclosed areas removed switches that off when you want every matching pixel gone wherever it sits.
On a green or blue backdrop the tool also pulls that hue back out of the fade, in proportion to how transparent each pixel came out. That is the green rim a cheap keyer leaves around shoulders and hair.
When to reach for it
- A logo, an icon or a wordmark on white. An orange rounded rectangle on a white page gives up 52% of itself on the default setting, and the mark comes through untouched.
- A product on a seamless sweep. A 4032 × 3024 frame of a blue shape on a white backdrop with a lighting falloff, saved at JPEG quality 0.90: the picker opened in about a second reporting 79% removed, and the download was 7.5 MB of transparent PNG.
- A studio green screen. A skin-toned block on #00b140 loses 66% of the frame, which is the backdrop and nothing besides, and the middle of the subject stays at full opacity.
- A scanned signature or stamp. Paper is one color and ink is another, which is the whole problem this tool solves.
- A screenshot with a flat panel behind it. Try One color there, which takes the exact shade you clicked and stops.
What this tool cannot do
It has no idea what a subject is. It compares colors. On a 4032 × 3024 test frame of a lit wall, a wooden floor and a window, the default took out 28%, most of it the bright half of the wall, and left the floor and the shaded corner sitting there. You end up with a picture full of holes. The preview shows you that before you press the button, which is the reason the preview is there.
Hair, fur and motion blur do not survive. Anything finer than the fade ramp comes back either whole or cut off flat.
A subject wearing the backdrop color loses that part of itself. White sneakers on a white sweep come back with holes in the toes, and widening the match makes it worse.
Heavy JPEG compression fights the key. The ringing around a hard edge sits halfway between subject and backdrop, so it either stays as a fringe or eats into the outline.
Output is PNG, always. It is the one format this browser encodes that carries an alpha channel and that everything opens. JPEG has no alpha at all, so saving a keyed picture as JPEG anywhere turns the transparency white.
The file gets bigger, sometimes much bigger. That 2.1 MB sweep photo came back as 7.5 MB. A busy 5.2 MB frame came back as 37.3 MB. PNG is lossless and it now carries a fourth channel per pixel.
One picture at a time, and an animated GIF loses its animation. Only the first frame is decoded, and it comes out as a still PNG.
Very large pictures ask a lot of one browser tab. A 12.2 megapixel picture is 48 MB of raw pixels, and the tool holds the original and the working copy at once while it runs. Reading the pixels took 21 ms in Chromium, keying them about 135 ms, and writing the PNG 99 ms. On a phone, expect several times that.
Take a file over 20 MB. Drop a 25 MB scan and the dropzone turns it away, where the format converters here would accept it up to 50 MB. Holding two copies of the pixels is why. The output can land above the cap as well: that 5.2 MB frame came back as 37.3 MB, so this tool will not read its own result back in.
Let you choose a color from the keyboard. The opening guess comes off the border ring before anyone touches anything, and Tab reaches the three amount buttons and the enclosed-areas switch. Picking a different color means clicking the picture, and no key does that. An aria-label promising otherwise would strand you further in.
Frequently asked questions
Why is the PNG so much larger than the photo I dropped in?
JPEG throws detail away to get small and stores no transparency. PNG throws nothing away and stores a fourth number for every pixel. Measured on the same 4032 × 3024 frame: 2.1 MB in, 7.5 MB out. Cropping the picture first is the cheapest way to bring that down.
Can I save the result as a JPEG?
Not usefully. JPEG has no alpha channel, so whatever you removed comes back as white the moment you convert. If the destination cannot read PNG, put the cutout on a background you chose in an editor and export that.
Part of my subject went transparent. What do I change?
Switch to One color, which only takes the exact shade you clicked. If a light gray inside the subject keeps vanishing, click a different backdrop pixel: the tool keys whatever you pick, and a corner of the sweep is usually a purer sample than the middle.
The size row says nothing matched. What happened?
Under 2% of the picture came out transparent, so you got your own file back rather than a much heavier copy of a picture that looks identical. The usual cause is a click that landed on the subject. Click the backdrop instead and watch the percentage next to the color chip.
Does it work on a photo of a person?
Only if that person is standing in front of one flat color. In a kitchen or a park, the tool finds patches of matching color and takes those. Nothing here looks for a human outline.
What if my picture already has transparent areas?
They stay transparent. The tool never makes an invisible pixel solid again. When the whole border ring is already transparent there is no backdrop to guess from, so the picker shows your picture untouched and says so, and clicking a color on it starts the key. Press the button without clicking and your file comes back as it arrived.
Is my picture uploaded?
No. The page loads its keying code from this site on your first click and does the rest in the tab. The picture itself never becomes a network request.