> For the complete documentation index, see [llms.txt](https://vikram-bajaj.gitbook.io/cs-gy-6313-information-visualization/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://vikram-bajaj.gitbook.io/cs-gy-6313-information-visualization/main-5/color/color-specification.md).

# Color Specification

This section discusses how to specify color in order to aid in visualization.

As we discussed earlier, any color can be obtained from the 3 channels.

To specify a color, we must first choose a **color space**. The set of all the colors that can be generated from a color space constitute the **gamut** of that color space.

Not all color spaces are equivalent. Some commonly used color spaces are discussed below.

## RGB

This refers to the **Red Green Blue** color space.

It is commonly used on the screens of digital devices.

R, G, B have values ranging from 0 to 1 each. (0,0,0) refers to **black** and (1,1,1) refers to **white**.

![](https://192301203-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-M5-0RG_uqhxyMNjpMUW%2F-M5-0SvQ45Rarxg8L2lA%2F-M5-0UzHYTPVd3Fc4RR8%2Frgb%20cube.png?generation=1586990821766406\&alt=media)

The issue with the RGB color space is that it **isn't very natural** i.e. it is **not easy** to generate colors that are useful for visualization. That is why it isn't commonly used for visualization.

## HSV / HSL

This refers to **Hue Saturation** and **Value/Lightness**.

It is easier and more natural to specify colors using this color space.

**Hue** is the name of color, **saturation** is the vividness and **lightness** is the brightness of the color.

![](https://192301203-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-M5-0RG_uqhxyMNjpMUW%2F-M5-0SvQ45Rarxg8L2lA%2F-M5-0UzJMPTooSx41o_r%2Fhsl%20cylinder.png?generation=1586990821497885\&alt=media)

The issue with this color space is that it is **not perceptually uniform**. This means that distances that are mathematically computed in the color space do not correspond to the perceptual distances.

## CIE Lab and CIE Luv

CIE stands for Commission Internationale de l'Eclairage (i.e. the International Commission on Illumination).\
CIE Lab and CIE Luv are perceptually uniform color spaces.

### CIE Lab (or L\*a\*b\*)

![](https://192301203-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-M5-0RG_uqhxyMNjpMUW%2F-M5-0SvQ45Rarxg8L2lA%2F-M5-0UzL7qh-ABldxjzx%2FCIE%20Lab.PNG?generation=1586990821305830\&alt=media)

There are 3 channels:

* L\* (Lightness): This refers to the lightness/brightness of a color and it is perceptually uniform
* a\*: It is a chromatic axis that goes from Green to Magenta/Red
* b\*: It is a chromatic axis that goes from Yellow to Blue

This color space is a nonlinear transformation of the physical measure for the color (i.e. the wavelength). It is designed to be perceptually linear.

One issue with Lab is that, even though it is perceptually uniform, it is **not easy to use**.

## CIE Lch (HCL)

This color space has the best of both worlds: **usability** and **uniformity** (i.e. perceptual uniformity).

It is a modified L\*a\*b\* where a\* and b\* are converted into:

* c\* (**chroma** i.e the relative saturation)
* h$$^{\circ}$$ (**hue** i.e. the angle of the hue in CIE Lab)

L\* still refers to the **luminance**/**lightness**.

![](https://192301203-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-M5-0RG_uqhxyMNjpMUW%2F-M5-0SvQ45Rarxg8L2lA%2F-M5-0UzNwskOT_dF0EOw%2FLch.PNG?generation=1586990821413767\&alt=media)

## A Comparison Between Color Spaces

![](https://192301203-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-M5-0RG_uqhxyMNjpMUW%2F-M5-0SvQ45Rarxg8L2lA%2F-M5-0UzPTB93hq5X3ufj%2Fcolor%20spaces%20summary.PNG?generation=1586990821668509\&alt=media)