What is a "Color Profile" in an Image?
The color profile of an image is something that tells the computer how to interpret the color values of the pixels in the data stored inside an image file. Two images that have pixels with identical RGB values but with different color profiles would be displayed on the screen using different colors because what the color an RGB triplet of values represents in one profile is different from what that same RGB triplet means in a different profile.
To understand color profiles, one must understand color depth: the values of the pixels are stored with a certain precision of bits (or bytes). In a 24 bits per pixel (24bpp) image that has 3 color channels (Red, Green, and Blue), each channel has 8 bits or 1 byte of precision, which means we can store up to 256 unique values, e.g. from 0 to 255 (or 0x00 to 0xFF).
The question is what each one of these 256 unique values per channel should represent in terms of color.
In the most commonly used color profile on the web, gamma-corrected "perceptual" sRGB, if you have a color that is precisely at the middle value of 127, 127, 127, that color will look like it's mid gray to us humans. In other words, in this color profile, 50% means the mid gray brightness.
However, when we consider how many photons of light our eyes perceive, it takes a small amount of photons to reach this perceptual mid gray level. We are more sensitive to small changes in light when it's dark than when it's bright. However, we still only have 256 values per channel. In order to make better use of this limited amount of values, the sRGB color profile distributes more values toward the dark colors, otherwise we would use most of the upper range to store tiny changes in brightness that humans can barely distinguish.
The function that decides this distribution is a "gamma" function. For perceptual sRGB, the gamma is 2.2. What this means is essentially that for a value x, we calculate x ** (1 / 2.2) (x to the power of 1 divided by 2.2). That might be difficult to visualize if you don't know a lot of math: "to the power of 1 / 2" means the same thing as "the square root of," so using 1 / 2.2 as the exponent just means it's something between the square root and the cube root of the number.
The color profile that works based on the real output of brightness has "linear" gamma, such as linear sRGB. With this color profile, 127, 127, 127 is much brighter than what we think mid gray is.
127 ** 1 / 2.2 = 57.7As we can calculate above, 57, 57, 57 in linear sRGB is roughly equivalent to 127, 127, 127 in perceptual sRGB.
Besides sRGB, we also have all sorts of color profiles based on what levels of light devices such as cameras can capture, and devices such as screens can display. We call each of these ranges of colors a "gamut." If you capture an image with a camera that has a wide gamut, but the screen can't display all the colors correctly, that means the screen's gamut is narrower (or perhaps just different) from the camera's gamut.
Finally, converting from one color profile to the other can lead to rounding errors. These errors can be partially solved by using a higher color depth, e.g. if we use 16 bits per channel (48bpp), then each channel has 65536 values instead of 256, and "mid gray" (in perceptual sRGB) becomes the value 32767 instead of 127.
