Color palettes

From TheAlmightyGuru
Revision as of 13:53, 21 May 2021 by TheAlmightyGuru (talk | contribs) (Indexed Palettes)
Jump to: navigation, search

A color palette in computing terms is a lookup of colors that a display system can use. This can either refer to the complete color set it can use, or just the color set it can use at a time, or in a certain area on the screen. Modern computers have a palette in the billions of colors, but in the early days of computing, color palettes were far more limited.

True Color - Millions of Colors (24 and 32 bit)

256 - Red, 256 - Green, 256 - Blue.

So-called "true color" is a 24-bit RGB color system which uses a full byte (8-bits) for each red, green, and blue intensity (or channel) resulting in 16,777,216 possible colors. Here is an example of a photo utilizing 24-bit color.

Color Palette - RGB - Test.png

32-bit color is also commonly referred to as "true color," because it still only has 16,777,216 unique colors. The additional bits come from an 8-bit alpha transparency channel. However, alpha transparency is not a color, but rather instructions for how to blend multiple colors together. An alpha intensity of 0 is totally transparent while an alpha intensity of 255 is totally opaque.

When displayed on properly calibrated hardware, true color covers the majority of the color gamut the human eye is capable of distinguishing (around 10,000,000 unique colors) which makes true color good enough for storing any image that humans are capable of perceiving visually. For example, the image below is made up of two different shades of red. The left side has a red intensity of 254, while the right side has an intensity of 255. When viewed on a high-quality monitor, the demarcation point is nearly indistinguishable to most people.

Color Palette - True Color Test.png

High Color - Thousands of Colors (15 and 16 bit)

32 - Red, 64 - Green, 32 - Blue.

High color is a 16-bit RGB color system which uses 2 bytes to describe each color. This is typically done in one of two ways. The first way is more simple, and uses five bits per channel. This yields 32 intensities each for red, green, and blue channel, and results in 32,768 total colors. This is commonly referred to as 15-bit color since only 15 of the 16 bits are actually used to describe the colors. A second, more complicated way uses all 16 bits by assigning 6 bits to the green channel. This results in 65,536 colors, with emphasis on green. However, the programming must know that green channel supports 64 levels of intensity.

Although a fair amount of display hardware made use of 16-bit color over the years, few consumer-level graphic formats support it. Regardless, it was a very large step up from 8-bit palettes because it results in enough colors to display photographs of decent quality while still being small enough in size to fit on limited hardware. Notice how the example below looks nearly identical to the true color original. It's only when you zoom in that you begin to see the quality loss.

Color Palette - 16-Bit Color - Example.png

Deep Color - Billions of Colors (30, 36, 48, 56, and 64 bit)

Deep color is a blanket term for any color depth greater than 8-bits per color intensity. 30-bit color uses 10-bits each for red, green, and blue channel resulting in 1,073,741,824 possible colors. 36-bit color uses 12-bits for each channel for a total of 68,719,476,736 color. 48-bit color uses 16-bits for each channel for 281,474,976,710,656 total colors. 56-bit color is 48-bit with an 8-bit alpha channel. 64-bit color uses 16-bit for the red, green, and blue channels, and adds a 16-bit alpha channel.

Although the human eye cannot distinguish such minor differences in color intensity, photographers and graphic designers will often use these higher color depths to guard against the color loss that occurs from rounding errors when performing various effects on images. I can't provide any examples of these higher bit depths because the web software used to run this site doesn't support such large color depths.

Black and White

The color term "black and white" means different things to different people. The name implies that the color palette should consist simply of black and white, but, no doubt due to "black and white" photography and television, many people think the term black and white refers to shades of gray. Both are discussed in this section.

True Black and White

True black and white.

True black and white images use 1-bit color which yields 2 different colors, which are always black and white. The image typically doesn't store which color index is meant for black for white, nor does it store the intensity of either. However, the majority of black and white formats use 0 for black and 1 for white, and typically display black at the lowest intensity and white at the highest intensity, but, because there are deviations, assurance is not guaranteed.

When stored in a graphic format, eight pixels can fit into a single byte of data.

Color Palette - 1-Bit Color (Black and White) - Example.png

Grayscales

Grayscale is a term used to describe an image made up of multiple shades of gray. The most common grayscale is 8-bit which consists of 256 intensities of gray, however, early LCD displays often used lower bit depths like the 2-bit Game Boy which used 4 intensities.

16-bit grayscale is sometimes used by photographers and graphic designers to avoid losing intensity data in rounding errors, but it's too granular of an intensity for the human eye to discern. At 8-bit grayscale, the human eye begins to struggle to see a difference in intensity in grayscales, however, it's still discernible. In the image below, the left side uses 127 intensity, while the right side uses 128 intensity. See if you can spot where the shift in intensity takes place.

Color Palette - Grayscale Test.png

Indexed Palettes

Indexed palettes are those which have a predefined set of colors. These were especially popular during the 8 and 16 bit era of digital art and used by pretty much every computer and video game system made.

1-Bit Palettes

A 1-bit, 2-color palette.

Single bit images where the colors are defined (rather than just assumed to be black or white) consist of two colors. These colors may be defined by and RGB value, but are more commonly chosen from a predefined group of colors or a single-byte palette palette. Images which use such palettes are pretty uncommon. One example is the high-resolution graphics mode of the CGA graphics card which can be set to display black and one custom color chosen from its 16-color palette. This palette can be defined to display images slightly better than black and white, but are still extremely limited.

Color Palette - 1-Bit Color (Palette) - Example.png

CGA Palettes

The IBM Color Graphics Adapter supported several graphics modes including a 16-color text mode (the palette is described in the EGA section below, a high resolution 1-bit color mode, and a low resolution graphic mode which included fixed 2-bit palettes. The colors in these palettes were not chose to compliment each other, but rather contrast each other. While this makes it easy to differentiate between the colors on a small monitor, none of them are particularly attractive, and they are all useless for displaying photos.

EGA Palette

Default EGA palette.

The default Enhanced Graphics Adapter color palette is 4-bit, thus allows for 16 color indexes. It was designed to be backward-compatible with the text mode colors of the CGA card and uses the same palette of red, green, blue, cyan, yellow, magenta, black, and white, then a high intensity version of each color. However, unlike the CGA, the 16 colors of the EGA palette could be customized from a palette of 64 possible colors. See the R4 G4 B4 palette below. Unfortunately, very few programs took advantage of this feature.

Color Palette - 4-Bit Color (EGA) - Example.png

VGA Palette

Default VGA palette.

The default Video Graphics Array color palette uses 256 color indexes. It was designed to be backward-compatible with both the CGA and EGA palettes, so the first 16 colors match the CGA/EGA standard. After that, there are 16 shades of gray, and then a 24-index color spectrum beginning with blue and rotating toward red, yellow, green, and back to blue. The spectrum is repeated two more times with each subsequent copy having a lower saturation than the previous. Those 72 colors are repeated two more times with each subsequent copy having a lower intensity. There are also 8 indexes at the end left black, I'm presuming because it would take nine indexes to accommodate another color using this scheme, though I don't know why they didn't just pad out the gray scale with the unused values or provide eight more unique colors.

Color Palette - 8-Bit Color (VGA) - Example.png

VGA color space.

Although this is the default color set, the entire palette could be customized. Each index can be made up of red, green, and blue intensities ranging from 0-63, or a total palette size of 262,144 colors. The complete 18-bit color palette is seen to the right. It was common for software developed for the VGA card to have use custom palettes.

When stored in an external file, palette files would often be exactly 768 bytes, which is enough to define an RGB intensity for each of the 256 indexes. Because of this, it's common for game editors to assume a 768-byte file is a palette lookup.

Windows 3.0 4-Bit Palette

Windows VGA palette.

The first release of Windows 3.0, when configured to standard VGA mode, used the high resolution 640x480 4-bit color mode of the Video Graphics Array and used a custom 16-color palette. The colors are similar in concept to the original Color Graphics Adapter text mode palette using an RGB CYM BW system with a low and high intensity version of each, but it starts with a darker base, and uses the 255 intensity for the brighter colors. This yields an over all darker palette, but it's more conducive to the white background of Windows compared with the black background of DOS. The color order, however, is not in-line with the CGA standard. You can see from the example image below, it is not very useful for displaying photographs.

Color Palette - 4-Bit Color (Windows 3.0) - Example.png

Windows 3.0 8-Bit Palette

Windows SVGA palette.

Those users who had a Super VGA display adapter and monitor could see Windows 3 in 8-bit color. This palette is backward-compatible with the 4-bit palette but adds 230 evenly spaced colors making it much better at displaying photographs. However, the last 7 colors are duplicates of earlier colors, and therefore wasted.

Color Palette - 8-Bit Color (Windows 3.0) - Example.png

Windows 3.1 4-Bit Palette

Windows 3.0 VGA palette.

When Windows 3.1 was released, the darker colors of the palette were made even darker than the pale 3.0 originals. This palette was used for all other versions of Windows 3.1 including 3.11, Workgroups, etc.

Color Palette - 4-Bit Color (Windows 3.1) - Example.png

Windows 3.1 8-Bit Palette

Windows 3.1 SVGA palette.

Those Windows 3.1 users who had a Super VGA display adapter and monitor used this palette. Unlike the 3.0 palette, this is not backward compatible with the 3.1 4-bit color palette, so the driver had to properly map the colors over. The most obvious is how the bright 8 colors are moved to the end of the palette rather than keep their position at the beginning. This palette also adds a couple new general colors at the beginning and end of the palette stealing two colors from the larger spectrum. However, unlike the Windows 3.0 palette, it doesn't waste 8 entries on duplicate colors.

Color Palette - 8-Bit Color (Windows 3.1) - Example.png

Single-Byte Palettes

A single-byte palette is one that can be defined using eight or fewer bits rather than a lookup table. Single byte color palettes were popular in the early days of computing when memory was at a premium and palette lookup tables were memory intensive. There are many different algorithms used to encode an entire color palette into a single byte and quickly get the results.

R1-G1-B1, 3-bit, 8 Colors

1 - Red, 1 - Green, 1 - Blue.

RGB 3-bit uses one bit for each red, green, and blue value which allows for two intensities per value yielding eight colors total. To get each RGB value, simply multiply its bit by 255. This is the smallest derived palette that can include red, green, and blue simultaneously.

This palette was mostly ignored in the USA, but it was used by some early 8-bit Japanese home computers like the PC-8800 series and the Sharp X-1.

Such a limited color palette produces especially grainy results with real-life photos.

Color Palette - 3-Bit Color (1-1-1) - Example.png

R4-G4-B4, 6-bit, 64 Colors

4 - Red, 4 - Green, 4 - Blue.

RGB 6-bit uses two bits for each red, green, and blue value which allows for four intensities per value yielding 64 colors total. The Enhanced Graphics Adapter uses this system to represent all of the possible colors of which it can use 16 at a time. In computer systems with 8-bit bytes, this color system isn't very compact because it leaves two unused bits per byte, although, the unused bits could be used to store additional information. On a computer architecture which uses 12-bit bytes, two colors can be stored in a single byte. With 8-times the number of colors compared to 3-bit color, the output photo is much nicer looking.

Color Palette - 6-Bit Color (4-4-4) - Example.png

R6-G6-B6, 8-bit, 216 Colors

6 - Red, 6 - Green, 6 - Blue.

Because RGB color has three unique values, it can't be stored into single 8-bit byte evenly while also using all the indexes. This has led to various algorithms being devised to get an optimal palette. The 6-6-6 method yields the largest number of colors possible while still having an equal number of intensities for each value. This layout uses all 8-bits, but the red, green, and blue values are determined with the following algorithm: (36×R)+(6×G)+B. This allows for six intensities per value yielding 216 colors total. The remaining 40 indexes are left unused and could be filled from a color table. While this makes it slightly more CPU intensive to extract a color from the palette, it does have the advantage of being perfectly uniform across each value. In fact, this color system was used by early Web browsers as their "Web-safe" color set. Naturally, the added colors make the end result more attractive.

Color Palette - 8-Bit Color (6-6-6) - Example.png

R6-G7-B6, 8-bit, 252 Colors

6 - Red, 7 - Green, 6 - Blue.

Because the human eye is better at resolving green than red or blue, one of the more optimal palette generation algorithms is add emphasis to green. This 6-7-6 algorithm also uses all eight bits, but adds an extra intensity level for green with the algorithm (42×R)+(6×G)+B. This allows for seven intensities of green and two of red and blue yielding 252 colors total. Like 6-6-6, this is more CPU intensive, but by adding an additional 36 colors, it results in a better output.

Color Palette - 8-Bit Color (6-7-6) - Example.png

R6-G8-B5, 8-bit, 240 Colors

6 - Red, 8 - Green, 5 - Blue.

This configuration is made because the human eye is actually a lot better at resolving green than blue, but it's also better at resolving red. So, this 6-8-5 gives one intensity level of blue to green. The algorithm uses all eight bits and can be represented at (40×R)+(5×G)+B. This allows for six intensities of red, eight of green, and only five of blue, yielding 240 colors total. Like 6-6-6, it's also more CPU intensive, but by putting more emphasis on green at the cost of blue, it can actually yield better results for a human viewer, despite the lost colors.

Color Palette - 8-Bit Color (6-8-5) - Example.png

R8-G8-B4, 8-bit, 256 Colors

8 - Red, 8 - Green, 4 - Blue.

This 8-bit configuration uses three bits for each red and green value, but only two bits for blue. This allows for eight intensities for red and green, and four for blue, yielding 256 colors. This layout is good for human viewing and yields the maximum amount of colors. While the palette might not be as versatile as a 6-7-6 or 6-8-5, it is far less CPU intensive because each value is stored in its own bit space. A palette of this type was used by early Namco arcade games like Pac-Man.

Color Palette - 8-Bit Color (8-8-4) - Example.png

R8-G4-B8, 8-bit, 256 Colors

8 - Red, 4 - Green, 8 - Blue.

To give you an idea of why green is the focus in all of the non-homogeneous palettes above, here is an algorithm similar to 8-8-4, but with the least emphasis on green. This system uses three bits for red and blue, and only two for green. This results in eight levels of intensity for red and blue, but only four for green, yielding 256 colors. Despite having four times the colors, the output isn't much better than the 64-color 4-4-4 output from above. Green is extremely important.

Color Palette - 8-Bit Color (8-4-8) - Example.png

R4-G8-B8, 8-bit, 256 Colors

4 - Red, 8 - Green, 8 - Blue.

This is like the 8-8-4, but with emphasis added to blue and green over red. This system uses two bits for red, and three for green and blue. This results in four levels of intensity for red, but eight for green and blue, yielding 256 colors. Notice how the output paradoxically looks more red despite having less red intensity. The warmer tone comes from the loss of nuance in red.

Color Palette - 8-Bit Color (4-8-8) - Example.png

Categories

Links