Gimp-Forum.net
What are color-indexed images (a.k.a. Why are my colors all wrong)? - Printable Version

+- Gimp-Forum.net (https://www.gimp-forum.net)
+-- Forum: GIMP (https://www.gimp-forum.net/Forum-GIMP)
+--- Forum: Tutorials and tips (https://www.gimp-forum.net/Forum-Tutorials-and-tips)
+--- Thread: What are color-indexed images (a.k.a. Why are my colors all wrong)? (/Thread-What-are-color-indexed-images-a-k-a-Why-are-my-colors-all-wrong)



What are color-indexed images (a.k.a. Why are my colors all wrong)? - Ofnuts - 05-24-2021

You are likely reading this because Gimp is doing weird things with your image colors. This is usually caused by your image being color-indexed.
This can be checked by looking at the Gimp window title bar, that indicates the current image mode:

[attachment=6055]

If this is the case, read on....

What are color-indexed images?

In most image formats, each pixel is described with three separate values for red, green, and blue. These values are usually kept in 8-bit bytes(*). A byte can hold 256 values, so the total number of possible colors (R, G, and B combinations) is 256×256×256=16777216 (≈16.8 million).

However, this can be quite wasteful if there are few colors. Enter color-indexed images. In such images, the (limited) set of colors is kept in a list, called the colormap. Colors in the list are described by the usual three bytes,  and pixels are described by a single number which is the index of their color in the list.

For instance you can have a colormap with just 8 colors such as this:

[0]     0,  0,  0   # Black
[1]   255,  0,  0   # Red
[2]     0,255,  0   # Green
[3]     0,  0,255   # Blue
[4]   255,255,  0   # Yellow
[5]     0,255,255   # Cyan
[6]   255,  0,255   # Purple
[7]   255,255,255   # White

and the yellow pixels in the image will be designated with the value 4.

A (small, 6×4 pixels ) French flag would for instance be represented by:

   3   3   7   7   1   1
   3   3   7   7   1   1
   3   3   7   7   1   1
   3   3   7   7   1   1


Colormaps are usually limited to 256 colors, because this allows the index to fit in a byte, so this makes the image use one third of the bytes needed for a full-color equivalent. With a bigger list, you would need at least two bytes and so would only get a 33% reduction in size, likely not worth the added complexity.

In regular images, the color map is very often close to 256 colors. Even if the image looks simple with areas of uniform colors, due to anti-aliasing the pixels on area boundaries are usually a blend of the colors on either side, so the color map of that blue and green image contains many intermediate colors:

[attachment=6058]

In addition, if the image has transparent pixels, the transparent pixels are indicated by using a color in the colormap and flagging it as the "transparent" color (so the actual color map is restricted to 255 pixels, if you don't count transparency).

Color-indexed image formats

There are two common image formats that can be color-indexed:
  • PNG: A variant of the PNG format is color-indexed, even if this not a frequent usage for this format
  • GIF: GIF images are always color-indexed

GIMP handling of color indexed-images

In Gimp there are three image modes, RGB (3 color values per pixels), grayscale (one color value per pixel), and color-indexed. As shown above, with the default settings the image mode is displayed in the title bar of the image window. You can change the image mode with the Image ➤ Mode menus, which is also a way to check the current image mode.

Checking the color map

The colormap of the current image can be check using Windows ➤ Dockable dialogs ➤ Colormap. There is a single  colormap that applies to all the layers of the image(**).

Loading images

When the loaded image is in a color-indexed format, it is kept color-indexed in GIMP. So loaded GIFs are always color-indexed, while loaded PNGs can occasionally be so

Exporting images

If the image is color-indexed in GIMP, it is exported as a color-indexed file if the image format supports it (this is one way to create color-indexed PNGs). If the image is not color indexed and you export to a color-indexed format, the image is color-indexed on the fly.

Editing images

When you edit a color-indexed image, Gimp never changes the color map implicitly. This means that you cannot use colors in the image that are not already in the color map.

In particular:
  • All the colors of external images that you try to add to your color-indexed image will be adjusted the "closest color" in the color map, this includes:
    • Images that you load by File ➤ Open as layers
    • Anything that you paste (whatever the source: another Gimp image, or another application)
    • Layers that you drag from other open Gimp images
  • Most color tools (Levels, Curves, Brightness/Contrast, Saturation...) will behave strangely, because color values will "jump" between colors in the color map.
  • Many filters will be disabled.
  • Whatever the Foreground/Background colors are set to, the paint tools will use the nearest color in the color map.

In addition, since the handling of color-indexed image in Gimp is modeled on the GIF format, the opacity of layers is binary, everything is either fully opaque or fully transparent.

How can this be avoided?

The obvious solution is to convert the image back to full RGB (Image ➤ Mode ➤ RGB).

But this introduces new problems that you will have to deal with if you want a color-indexed format at the end (typically, a GIF animation).
  • In most cases you will have started with a colormap already full, and added new image/features that add even more colors, so your image contains more than 256 colors (you can check the current number of colors using Color ➤ Info ➤ Color cube analysis). When the image is color-indexed again, some of these colors will have to be coerced into one of the remaining 256 colors. This will very often make the image look grainy or pixellated. In the worst case, if you add features/images that are in stark contrast with the initial images, half the colors in the initial image will be binned to make room for the colors of the new features. The result won't be pretty.
  • If the additional colors are on new layers, you can sometimes mitigate this by doing the color-indexing outside of Gimp. Export all the frames as full-RGB PNGs, and use an external tool to make the animation from them. The tools will likely use a colormap per frame and so alleviate the single-colormap restriction.
  • If you use the dithering options other than Positioned, the dithering pattern is random, and identical areas on successive frames end up being dithered differently, and identical pixels are no longer encoded identically. Because of this you get a changing background and optimization doesn't work that well.
(*) which was a hard rule in Gimp up to Gimp 2.8. Gimp 2.10 lets you have more than 256 values per color channel when you use high precision images.

(**) an extension to the  GIF animation format allows one colormap per frame, but Gimp doesn't support it.