Inversion is one of the few image operations that is perfectly reversible. Applying it twice returns the exact original, because the arithmetic is a simple subtraction from the maximum channel value rather than a lossy approximation. That makes it safe to experiment with in a way that most filters are not.
The work happens entirely inside the browser tab. Pixels are read out of a canvas, transformed in memory and written back, so a scanned document or a private photograph is never uploaded, queued or stored anywhere outside your own machine.
When inverting an image is the right move
The most common reason is a scanned film negative. A colour negative photographed or scanned as it sits on the strip is already the inverse of the scene, so inverting it recovers something close to the real image. The orange mask baked into most colour film means the result still needs a white balance correction, but inversion is the first and largest step.
The second common reason is legibility. Documents scanned white on black, terminal screenshots, dark mode interface captures and X ray style images are frequently much easier to read once inverted, and inverting is a far cleaner fix than fighting with brightness and contrast sliders.
- Invert a scanned film negative to recover a positive image.
- Invert a white on black scan or screenshot so it prints without flooding the page with ink.
- Invert a dark mode screenshot before pasting it into a light document.
- Invert a mask or matte so the selected and unselected areas swap.
- Invert a single channel to produce a deliberate colour shift for design work.
What an inverted image actually is
Each channel of an eight bit image holds a value from 0 to 255. Inversion replaces every value with 255 minus that value. A mid grey of 128 stays almost exactly where it was, which is why inverting a low contrast image often looks less dramatic than people expect, while pure black and pure white swap completely.
Applying the operation to all three colour channels produces the classic photographic negative. Hues rotate 180 degrees around the wheel, so red becomes cyan, green becomes magenta and blue becomes yellow. Brightness inverts at the same time, which is why an inverted portrait looks strange in a way that a simple hue rotation does not.
The alpha channel is left alone. Transparent areas stay transparent instead of becoming opaque, which is what you want when inverting a logo or a cut out subject that has to sit on a coloured background afterwards.
Inverting one channel at a time
The channel switches let you invert red, green or blue independently. Inverting a single channel is not a negative, it is a strong and predictable colour shift. Inverting only blue, for example, pushes an image toward warm yellows while leaving the luminance relationships in the red and green channels intact.
Used as a straightforward negative image maker, leaving all three switches on is the setting you want. The strength slider blends between the original and the fully inverted result. At 50 every channel lands near mid grey, which flattens the image almost completely, so the useful settings are typically either near zero or near 100. Values between 70 and 95 give a washed out negative that still reads as a photograph.
How this image invert colors tool works in your browser
The file is decoded into an offscreen canvas, then getImageData hands back a flat typed array holding four bytes for every pixel. This image invert colors tool walks that array once, applies the subtraction to whichever channels you enabled, and writes the buffer back with putImageData before encoding a new blob.
Working on raw pixel data rather than a canvas filter is what makes per channel control possible, since the CSS style invert function always applies to all three channels together. The cost is a single pass over the buffer, which on a 12 megapixel image is a few tens of milliseconds.
No part of that pipeline reaches a network. Open your browser developer tools, watch the network panel while an image processes, and you will see nothing leave the page.
Choosing an output format for a negative
PNG is the right default. It is lossless, it keeps the alpha channel, and inverted images frequently contain large flat areas that PNG compresses extremely well. When you invert png colors the alpha channel is preserved exactly, so a transparent logo stays transparent. If you plan to invert the file again later to recover the original, PNG is the only format that guarantees the round trip is exact.
JPG is worth choosing only when the inverted result is a finished photograph headed for sharing. Because JPEG compression works on luminance and chroma separately, an inverted image can compress slightly differently from its original, so do not assume the file size will match.
| Channels inverted | Result | Typical use |
|---|---|---|
| Red, green and blue | True photographic negative | Film scans, dark mode screenshots |
| Red only | Strong cyan shift | Design and poster effects |
| Green only | Strong magenta shift | Design and poster effects |
| Blue only | Warm yellow shift | Colour grading experiments |
| None | Unchanged image | Comparison against the original |
How to invert image colors online
- 1
Add your image
Drop a PNG, JPG or WebP onto the drop area, or click it to browse. The file never leaves your device.
- 2
Choose the channels
Leave red, green and blue all switched on for a normal negative, or disable one for a deliberate colour shift.
- 3
Set the strength
Keep the strength at 100 for a true inversion. Lower values blend the result back toward the original.
- 4
Invert and download
Press invert, check the preview, then download the result as PNG or JPG at the original dimensions.
Related tools worth bookmarking
Sources and further reading
- MDN: CanvasRenderingContext2D.getImageDataHow the raw RGBA pixel buffer is read out of a canvas, which is the operation this tool inverts in place.developer.mozilla.org
- W3C: Filter Effects Module Level 1Defines the invert filter function and the exact arithmetic that partial inversion strengths interpolate against.w3.org
- WHATWG: HTML canvas specificationThe living standard describing ImageData, putImageData and the canvas encoding this tool relies on.html.spec.whatwg.org
Frequently asked questions
Common questions about the image invert colors tool.
Yes, if you invert at full strength and save as PNG. Inversion is its own opposite, so running the same operation twice on a lossless file returns the exact original bytes for every pixel.
Yes. Only the red, green and blue channels are touched, so the alpha channel passes through untouched. Download as PNG or WebP to keep it, since JPG has no alpha channel and will flatten transparent areas.
Colour negative film carries an orange mask that sits under the whole frame to correct dye impurities. Inverting turns that mask blue, so a white balance or colour cast correction is normally needed after inversion to finish the job.
Dimensions never change. Quality only changes if you export to a lossy format such as JPG, because the inversion itself is exact integer arithmetic on each channel and introduces no rounding error at all.
Not with a straight inversion, because inverting all three channels rotates hue and flips brightness at once. Turning off individual channels gets you part of the way, but a true luminance only inversion needs a different colour space.
The tool imposes none. The practical limit is the memory your browser tab can allocate, since the pixel buffer needs four bytes per pixel while it is being processed. Most laptops handle images well over one hundred megapixels.