Staaarter Tools

PNG Colors Reverser

Uploads a PNG and swaps its red and blue channel values for every pixel (converting RGB byte order to BGR), leaving green and alpha untouched, then lets you download the result, entirely in your browser. A free online tool from Staaarter, right in your browser.

Runs locallyUpdated 2026-07-26
editorcolorimagecanvaspng

Overview

Introduction

This tool swaps the red and blue channels of every pixel in a PNG, entirely in your browser.

It's the same operation used to convert between RGB and BGR pixel layouts, and it also produces a distinctive stylized color shift.

What Is PNG Colors Reverser?

A client-side channel-order swapper: it reads an uploaded PNG's pixel data and exchanges each pixel's red and blue byte values, leaving green and alpha exactly as they were.

This is distinct from color inversion, which negates values rather than reordering channels.

How PNG Colors Reverser Works

For every pixel, the tool reads the red byte, writes the blue byte into red's position, and writes the saved red value into blue's position. Green and alpha are never touched.

Because this is a pure swap with no math on the values themselves, the operation is lossless and exactly reversible.

When To Use PNG Colors Reverser

Use it when you need to convert raw pixel data between RGB and BGR byte ordering for compatibility with a library, format, or piece of hardware that expects the other layout.

It's also a quick way to produce a striking, unusual color-shifted variant of an image for a creative effect.

Often used alongside PNG Colors Inverter, PNG Hue Changer and PNG Colors Swapper.

Features

Advantages

  • A lossless, exactly reversible transformation — swap twice to get the original back.
  • Useful for real RGB/BGR interoperability needs, not just visual effect.
  • Runs entirely client-side; your image never leaves your device.

Limitations

  • It only swaps red and blue; there's no option to reorder channels differently (for example swapping green with something else).
  • As a creative effect, results can look unnatural on photos since it's not a perceptually-designed color transformation.

Examples

Convert an RGB PNG to BGR byte order

Input

A PNG stored as RGB (255, 0, 0) for a red pixel

Output

The same pixel data reordered as BGR (0, 0, 255)

This is the standard RGB-to-BGR conversion some libraries and camera pipelines require.

Create a stylized color-swap effect

Input

A photo with warm red/orange tones

Output

The same photo shifted toward cool blue/cyan tones

Swapping red and blue channels dramatically changes a photo's color character without inverting or desaturating it.

Best Practices & Notes

Best Practices

  • Use this specifically when you need true RGB/BGR channel reordering, not as a substitute for hue rotation or inversion.
  • Run it twice on a result if you need to undo it and get back the original color layout.

Developer Notes

The channel swap is a pure function over a Uint8ClampedArray pixel buffer that exchanges two byte values per pixel with a temporary variable, with no DOM dependency and no arithmetic on the color values themselves.

PNG Colors Reverser Use Cases

  • Converting pixel data between RGB and BGR byte layouts for library or hardware compatibility
  • Producing a distinctive stylized color-shift effect for design work
  • Debugging a suspected channel-order mismatch when importing raw pixel data from another system

Common Mistakes

  • Confusing this with color inversion — reversing swaps channel positions, it doesn't negate any values.
  • Expecting green to change — only red and blue are swapped, green is always left alone.

Tips

  • If you need to verify RGB/BGR conversion correctness, run the tool twice and confirm you get the original image back exactly.
  • For a value-based color effect rather than a channel swap, use the Colors Inverter or Hue Changer instead.

References

Frequently Asked Questions