How Color Works

Color comes from any source of light, and our eyes differentiate between colors based on the wavelengths of the light source. Each wavelength of light corresponds to a different color. There are two ways the human eye can see color: reflected color and projected color. Reflected color is what the eye sees when light bounces off an object and reflects back to the eye. Both ink on paper and paint on canvas are examples of reflected color. The color seen by the eye is determined by the wavelength of light that is reflected or absorbed by the medium. For example, ink printed onto sheets of paper absorbs some wavelengths of light and reflects others. Another example of reflected color is paint. Red paint appears red to our eyes because it absorbs blue and green wavelengths but reflects red wavelengths. Both ink and paint are examples of the subtractive color mixing process. The subtractive color mixing process means that different inks or paints are combined to absorb certain wavelengths of light.

The second way of viewing color is projected color, which is light emitted directly from a source, such as a computer or phone screen. Projected color uses an additive color mixing process in which different wavelengths of light are combined to create the colors seen by our eyes. For example, most screens are RGB screens—red, green, and blue screens—which create colors by mixing red, green, and blue light. When a screen is white, the full intensity of all three colors is emitted. For a screen to produce another color, different intensities of each light are projected. Projected color is used on different screens to display digital images.

There are two ways to represent a digital image: one being the bitmap and the other being the vector. A bitmap image is made up of pixels in a grid. The word “pixels” stands for picture elements. A closer look at some vocabulary will help us better understand how digital images work. “Bit depth” defines how many colors can be used to color in the pixels. The “resolution” of an image is how many pixels the image is made up of. In a black-and-white image, each pixel is controlled by one bit; as the number of bits increases, the color choices also increase. In fact, each bit doubles the number of colors that are available. For example, 2 bits provide 4 colors, and 3 bits provide 8 colors. A 24-bit picture has 16 million colors in use in the image. The 16 million colors available for a bitmap image are still fewer, however, than those in an analog image. Indexed color represents a digital image with limited color options. Using indexed color, each pixel contains an index from a specific color on the limited color palette. Indexed color contains a maximum of 256 colors and can be useful for saving storage space.

A vector graphic is the second way to represent a digital image. Vector graphics consist of shapes called objects that include lines, curves, shapes, and text. An example of a vector graphic is the tiger image shown on the right.  An SVG (Scalable Vector Graphics) allows a vector graphic to be scaled to a larger or smaller size, so that the image can be used in different settings, such as a billboard. Another example of a vector image is fonts. Fonts can be changed to any size without losing their shape or becoming pixelated.