Pipette

Shades of Gray

In this article we would like to attend to the topic "grey values". For this purpose, we will first look at what characteristics and what form gray values have in the various common color models. We then contrast a series of different gray values from black to white in a table, where the gray values are graded in always the same steps from color to color. This table makes it easy to understand the explanations introduced in the sections regarding the color models.

This article is divided into the following sections:

Gray Values in the RGB Color Model

Within the RGB color model, when the proportions of red (R), green (G) and blue (B) are identical, always a gray value is the result. If each of these proportions is 0, the result is black (in hexadecimal notation #000 or #000000). On the other hand, if all shares are at 100 percent, the result is white (in hexadecimal notation #FFF or #FFFFFF respectively 255 in decimal notation). In between, there are all other gray values accordingly graded.

Gray Values in the CMY Color Model

The CMY color model behaves similar to the RGB color model. Here, too, a gray value arises with exactly the same proportions of the components cyan (C), magenta (M) and yellow (Y). Also in this model, the gray value can be regulated by constantly varying these three values.

However, in the subtractive CMY color model, the direction is the opposite to the additive RGB color model: While in the CMY color model, for the color black, all components must be 100 percent and 0 percent for the color white, in the RGB color model it is exactly the other way around. In the RGB color model, white results when all components are at 100 percent and black when each of the 3 components is at 0 percent.

Gray Values in the CMYK Color Model

A gray value is obtained in the CMYK model by keeping the values for cyan (C), magenta (M) and yellow (Y) arbitrarily constant and regulating the gray value via the proportion of K (Key, Black). In this process, K can adopt values from 0 to 100 percent. Since "K" stands for the proportion of black, in the CMYK color model, assuming that cyan, magenta and yellow are at 0 percent, we automatically get pure black with a K value of 100 percent and the color white if we set the K value to 0 percent.

However, if we set the values of cyan, magenta and yellow to 100 percent, because of the subtractive color mixture, it behaves exactly the other way around: In this case we get a pure black with a K value of 0 percent and a pure white with a K value of value of 100 percent. If cyan, magenta and yellow have an identical value, which is between 0 and 100 percent, we still get gray values and a pure black by varying the K value, but no longer pure white. The higher the identical values of cyan, magenta and yellow, the darker the gray value starts at a K value of 0 percent. If cyan, magenta and yellow are even at 100 percent, we always get black, regardless of what percentage the K value is at.

Gray Values in the HSV Color Model

In the HSV color model, a gray value results from a saturation (S) of 0 percent. With this, the selected hue (H) no longer plays a role and the lightness (V, Value) determines where the gray is located between white and black.

This means that with a saturation of 0 percent, we can regulate the gray value solely through the lightness. With a brightness of 0 percent we get black, with a brightness of 100 percent we get white, in between there are the gray values. In this process, the hue can take any value without changing the result, since it is completely turned off by the saturation of 0 percent. However, typically, one does not use an arbitrary H value for black, white and gray values, but a value of 0 percent, as this best reflects the insignificance of this value.

Color Chart with Gray Values

To demonstrate these peculiarities of the different color models, the following table contains some shades of gray between black (top) and white (bottom) as well as their values in the different color models.

In the first column of the table you can see a small square with the gray tone of the respective table row. Behind this, there are three columns whose values are based on the RGB color model. The first of these three columns shows the hexadecimal RGB notation (column "HEX"), followed by the percentage notation (column "%") and the absolute decimal value in the column “RGB”. The last two RGB columns are just a single figure and do not show the values for R, G and B individually because the shares of R, G and B are identical. Therefore, for each, only one column is required. The same applies for the CMY color model (column "CMY"). Here the value for C, M and Y have to be identical, too. In the fifth column, there is only the value for K for the CMYK color model, since the other three values must all be 0 for the effect of the K value shown in the table. In the HSV color model, the value for the lightness (V) is decisively, so here it is the only value, too. The saturation (S) has to be 0% and the hue (H) does not matter. The values for X, Y and Z (XYZ color model), you can find in the last three columns.

 HEX%RGBCMYCMYKHSVXYZXYZXYZ
 #0000000.000100.0100.00.000.000.000.00
 #0505051.96598.098.01.960.140.150.17
 #0A0A0A3.921096.196.13.920.290.300.33
 #0F0F0F5.881594.194.15.880.450.480.52
 #1414147.842092.292.27.840.670.700.76
 #1919199.802590.290.29.800.920.971.06
 #1E1E1E11.763088.288.211.81.231.301.41
 #23232313.733586.386.313.71.601.681.83
 #28282815.694084.384.315.72.022.122.31
 #2D2D2D17.654582.482.417.62.492.622.86
 #32323219.615080.480.419.63.033.193.47
 #37373721.575578.478.421.63.633.824.16
 #3C3C3C23.536076.576.523.54.294.524.92
 #41414125.496574.574.525.55.025.295.76
 #46464627.457072.572.527.55.826.126.67
 #4B4B4B29.417570.670.629.46.697.047.66
 #50505031.378068.668.631.47.628.028.74
 #55555533.338566.766.733.38.639.089.89
 #5A5A5A35.299064.764.735.39.7210.211.1
 #5F5F5F37.259562.762.737.310.911.412.5
 #64646439.2210060.860.839.212.112.713.9
 #69696941.1810558.858.841.213.414.115.4
 #6E6E6E43.1411056.956.943.114.815.617.0
 #73737345.1011554.954.945.116.317.118.7
 #78787847.0612052.952.947.117.918.820.5
 #7D7D7D49.0212551.051.049.019.520.522.3
 #82828250.9813049.049.051.021.222.324.3
 #87878752.9413547.147.152.923.024.226.4
 #8C8C8C54.9014045.145.154.924.926.228.6
 #91919156.8614543.143.156.926.928.330.8
 #96969658.8215041.241.258.829.030.533.2
 #9B9B9B60.7815539.239.260.831.232.835.7
 #A0A0A062.7516037.337.362.733.435.238.3
 #A5A5A564.7116535.335.364.735.837.641.0
 #AAAAAA66.6717033.333.366.738.240.243.8
 #AFAFAF68.6317531.431.468.640.742.946.7
 #B4B4B470.5918029.429.470.643.445.649.7
 #B9B9B972.5518527.527.572.546.148.552.8
 #BEBEBE74.5119025.525.574.548.951.556.1
 #C3C3C376.4719523.523.576.551.954.659.4
 #C8C8C878.4320021.621.678.454.957.862.9
 #CDCDCD80.3920519.619.680.458.061.066.5
 #D2D2D282.3521017.617.682.461.364.470.2
 #D7D7D784.3121515.715.784.364.668.074.0
 #DCDCDC86.2722013.713.786.368.071.677.9
 #E1E1E188.2422511.811.888.271.675.382.0
 #E6E6E690.202309.809.8090.275.279.186.2
 #EBEBEB92.162357.847.8492.279.083.190.5
 #F0F0F094.122405.885.8894.182.887.194.9
 #F5F5F596.082453.923.9296.186.891.399.4
 #FAFAFA98.042501.961.9698.090.995.6104.0
 #FFFFFF100.002550.000.00100.095.0100.0109.0

This table was generated automatically by an individual software solution by Stefan Trost Media.

If you would like to have other gray levels or more accurate values or you want to work with this colors, you can simply use the program pipette. Just pick up the colors from your browser window with the pipette function so that you do not have to enter them manually. The Pipette can also be used to understand the effect of varying each component of the different color models by increasing or decreasing the proportions of each component in the program.

Other Color Charts

Lightness and Saturation | Lightness | Saturation | Shades of Grey | Color Names | Web Colors