Color tone definition. color theory. Light and dark colors, bright and soft colors. How to adjust color saturation when designing a print layout
In color theory saturation- this is the intensity of a certain tone, that is, the degree of visual difference between a chromatic color and an achromatic (gray) color of equal lightness. A saturated color can be called juicy, deep, less saturated - muted, close to gray. Completely not saturated color will be a shade of grey. Saturation is one of three coordinates in HSL and HSV color spaces. Saturation (chroma) in the CIE 1976 Lab and Luv color spaces is a non-formalized value used in the CIE LCH representation (lightness (lightness), chroma (chroma, saturation), hue (tone)).
In physical terms, color saturation is determined by the nature of the distribution of radiation in the spectrum of visible light. The most saturated color is formed when there is a peak of radiation at one wavelength, while radiation that is more uniform in spectrum will be perceived as a less saturated color. In a subtractive model of color formation, for example, when mixing paints on paper, a decrease in saturation will be observed when adding white, gray, black paints, as well as when adding paint of an additional color. ()
Purity- this is the degree of approximation of a given color to a pure spectral color, expressed in fractions of a unit.
The colors of the spectrum have the highest purity. Therefore, the purity of all spectral colors is taken as one, despite their different saturation. Most saturated Blue colour, least - yellow. Particularly saturated colors are observed in the spectrum, which does not contain impurities of white or black.
A chromatic composition can be built by varying the saturation of one color of constant lightness. This is achieved by adding to the selected color the required amount of gray equal in lightness to it. As a result, the variants of the selected color form a pure saturation series, in which the saturation naturally changes, the lightness remains unchanged, and the color tone becomes achromatic. ()
When black is added to a pure color, its lightness changes:
Another example of how the saturation of blue changes when gray is added to it:
Changing the saturation and lightness of shades of orange and blue:
As you can see in the picture, when adding medium gray and black to warm colors, reducing the saturation results in brownish shades of color, cool colors become grayish. In this picture, the change in pure color is based on two parameters: saturation and lightness. Lightness decreases with the addition of black, saturation - gray.
The least saturated and the lightest colors are pastels:
There are several quality characteristics color saturation:
- live (vivid) saturation;
- strong (strong) saturation;
- deep (deep) saturation.
Desaturated colors are characterized as dull (dull), weak (weak), or washed out.
An example of changing a color depending on its lightness (value) and saturation (chroma), using the example of red from Munsell's color book:
And this is how a green color looks like with the same lightness, but with different saturation (percentages of primary colors in the CMYK system are given).
Color brightness is a perception characteristic. It is determined by our speed of highlighting one tone against the background of others.
This is a relative characteristic, it can only be known in comparison. Complex shades, with an admixture of gray or brown, create the necessary contrast so that our eye highlights the most suitable tones for this definition.
Bright tones are called shades close to the pure spectrum. If the surface of the material reflects one or another wave (c) with the least distortion, then we consider that this tone is bright.
An admixture of white or black slightly affects the brightness of the color. So burgundy can be quite bright, like light yellow. Yellow-green is also a catchy tone, as an intermediate wavelength between green and yellow.
Each spectrum has its own lightness: bright yellow is the lightest; the darkest is blue and purple.
Intermediate are: blue, green, pink, red.
This statement is true if we consider a line of shades of the same color.
If, however, to highlight the brightest shade among other tones, then the color that differs in lightness from the rest as much as possible will be brighter.
Bright shades set a contrast with duller, darker or lighter ones, due to which we consider the combination to be saturated, expressive.
USEFUL ARTICLES ON THIS TOPIC (click on the picture)
Hue (hue of color) is denoted by terms such as "yellow", "green", "blue", etc. Saturation is the degree or strength of expression of a color tone. This color characteristic indicates the amount of dye or the concentration of the dye.
Lightness is a sign that allows you to compare any chromatic color with one of the gray colors, called achromatic.
Qualitative characteristic of chromatic color:
· Color tone
lightness
saturation. (Figure 8)
Color tone defines the name of the color: green, red, yellow, blue, etc. This is the quality of the color, which allows you to compare it with one of the spectral or purple colors (except chromotic) and give it a name.
Lightness is also a color property. Light colors include yellow, pink, blue, light green, etc., and dark colors include blue, purple, dark red, and other colors.
Lightness characterizes how much one or another chromatic color is lighter or darker than another color, or how close this color is to white.
This is the degree to which a given color differs from black. It is measured by the number of difference thresholds from a given color to black. How lighter color, the higher its lightness. In practice, it is customary to replace this concept with the concept of "brightness".
Term saturation color is determined by its (color) proximity to the spectral. The closer the color is to the spectral, the more saturated it is. For example, yellow lemon, orange - orange, etc. The color loses its saturation from the admixture of white or black paint.
Color saturation characterizes the degree of difference between a chromatic color and an achromatic color equal to it in lightness.
HUE SATURATION LIGHTNESS
Color tone determines the place of a color in the spectrum ("red-green-yellow-blue") This main characteristic colors. In a physical sense, the COLOR TONE depends on the wavelength of the light. Long waves are the red part of the spectrum. Short - shift to the blue-violet side. The average wavelength is yellow and green colors, they are the most optimal for the eye.
There are ACHROMATIC colors. It's black, white, and all the gray scale in between. They don't have a TONE. Black is the absence of color, white is the mixture of all colors. Grays are usually obtained by mixing two or more colors. All others are CHROMATIC colors.
The degree of color chromaticity is determined saturation. This is the degree of distance of a color from gray of the same lightness. Imagine how fresh grass by the road is covered with dust layer by layer. The more layers of dust, the weaker the original pure green color is visible, the less SATURATION of this green. Colors with maximum saturation are spectral colors, minimum saturation gives full achromatic (lack of color tone).
Lightness (brightness) - is the position of a color on a scale from white to black. It is characterized by the words "dark", "light". Compare the color of coffee and the color of coffee with milk. The maximum LIGHT has White color, minimum - black. Some colors are initially (spectral) lighter - (yellow). Others are darker (blue).
In photoshop: The next system that is used in computer graphics is the HSB. Raster formats do not use the system HSB for storing images, since it contains only 3 million colors.
In system HSB color is broken down into three components:
- HUE(Hue) - The frequency of the light wave reflected from the object you see.
- SATURATION(Saturation) is the purity of the color. This is the ratio of the main tone and colorless gray equal to it in brightness. The most saturated color contains no gray at all. The lower the color saturation, the more neutral it is, the more difficult it is to uniquely characterize it.
· BRIGHTNESS(Luminance) is the overall brightness of the color. The minimum value of this parameter turns any color into black. . (Figure 9)
(Figure 10)
 |
I am a programmer by education, but at work I had to deal with image processing. And then an amazing and unknown world of color spaces opened up for me. I do not think that designers and photographers will learn something new for themselves, but perhaps someone will find this knowledge at least useful, and at best interesting.
The main task of color models is to make it possible to specify colors in a unified way. In fact, color models define certain coordinate systems that allow you to uniquely determine the color.
The most popular today are the following color models: RGB (used mainly in monitors and cameras), CMY (K) (used in printing), HSI (widely used in machine vision and design). There are many other models. For example, CIE XYZ (standard models), YCbCr, etc. The following is given short review these color patterns.
RGB color cube
From Grassmann's law, the idea of an additive (i.e., based on mixing colors from directly emitting objects) model of color reproduction arises. For the first time, such a model was proposed by James Maxwell in 1861, but it received the greatest distribution much later.In the RGB model (from the English red - red, green - green, blue - cyan) all colors are obtained by mixing three basic (red, green and blue) colors in various proportions. The proportion of each base color in the final can be perceived as a coordinate in the corresponding three-dimensional space, so this model is often called a color cube. On Fig. 1 shows the color cube model.
Most often, the model is built so that the cube is single. The points corresponding to the base colors are located at the cube vertices lying on the axes: red - (1; 0; 0), green - (0; 1; 0), blue - (0; 0; 1). In this case, the secondary colors (obtained by mixing two base ones) are located in other vertices of the cube: blue - (0;1;1), magenta - (1;0;1) and yellow - (1;1;0). Black and white colors are located at the origin (0;0;0) and the point farthest from the origin (1;1;1). Rice. shows only the vertices of the cube.
Color images in the RGB model are built from three separate image channels. In Table. the decomposition of the original image into color channels is shown.
In the RGB model, a certain number of bits are allocated for each color component, for example, if 1 byte is allocated for encoding each component, then using this model, 2 ^ (3 * 8) ≈ 16 million colors can be encoded. In practice, such coding is redundant, because most people are not able to distinguish between so many colors. Often limited to the so-called. mode "High Color" in which 5 bits are allocated for encoding each component. In some applications, a 16-bit mode is used in which 5 bits are allocated for encoding the R and B components, and 6 bits for encoding the G component. This mode, firstly, takes into account the higher sensitivity of a person to green color, and secondly, it allows more efficient use of the features of the computer architecture. The number of bits allocated for encoding one pixel is called the color depth. In Table. examples of encoding the same image with different color depths are given.
Subtractive CMY and CMYK models
The subtractive CMY model (from the English cyan - cyan, magenta - magenta, yellow - yellow) is used to obtain hard copies (printing) of images, and in some way is the antipode of the RGB color cube. If in the RGB model the base colors are the colors of the light sources, then the CMY model is the color absorption model.For example, paper coated with yellow dye does not reflect blue light; we can say that the yellow dye subtracts blue from the reflected white light. Similarly, cyan dye subtracts red from reflected light, and magenta dye subtracts green. That is why this model is called subtractive. The conversion algorithm from the RGB model to the CMY model is very simple:
This assumes that the RGB colors are in the interval . It is easy to see that in order to obtain black in the CMY model, it is necessary to mix cyan, magenta and yellow in equal proportions. This method has two serious drawbacks: firstly, the black color obtained as a result of mixing will look lighter than “real” black, and secondly, this leads to significant dye costs. Therefore, in practice, the CMY model is extended to the CMYK model, adding black to the three colors.
Color space hue, saturation, intensity (HSI)
The RGB and CMY(K) color models discussed earlier are very simple in terms of hardware implementation, but they have one significant drawback. It is very difficult for a person to operate with colors given in these models, because a person, describing colors, uses not the content of the basic components in the described color, but somewhat different categories.Most often, people operate with the following concepts: hue, saturation and lightness. At the same time, when talking about the color tone, they usually mean exactly the color. Saturation indicates how much the described color is diluted with white (pink, for example, is a mixture of red and white). The concept of lightness is the most difficult to describe, and with some assumptions, lightness can be understood as the intensity of light.
If we consider the projection of the RGB cube in the direction of the white-black diagonal, we get a hexagon:
All gray colors(lying on the diagonal of the cube) are projected to the central point. In order to be able to encode all the colors available in the RGB model using this model, you need to add a vertical lightness (or intensity) axis (I). The result is a hexagonal cone:
In this case, the tone (H) is set by the angle relative to the red axis, the saturation (S) characterizes the purity of the color (1 means a completely pure color, and 0 corresponds to a shade of gray). It is important to understand that hue and saturation are not defined at zero intensity.
The conversion algorithm from RGB to HSI can be performed using the following formulas:
The HSI color model is very popular among designers and artists because this system provides direct control of hue, saturation and brightness. These same properties make this model very popular in machine vision systems. In Table. shows how the image changes with increasing and decreasing intensity, hue (rotated by ±50°), and saturation.
Model CIE XYZ
For the purpose of unification, an international standard color model was developed. As a result of a series of experiments, the International Commission on Illumination (CIE) determined the addition curves for the primary (red, green and blue) colors. In this system, each visible color corresponds to a certain ratio of primary colors. At the same time, in order for the developed model to reflect all visible to man colors had to enter a negative amount of base colors. To get away from negative CIE values, introduced the so-called. unreal or imaginary primary colors: X (imaginary red), Y (imaginary green), Z (imaginary blue).When describing color X,Y,Z values are called standard fundamental excitations, and the coordinates obtained on their basis are called standard color coordinates. The standard addition curves X(λ),Y(λ),Z(λ) (see Fig.) describe the sensitivity of the average observer to standard excitations:
In addition to standard color coordinates, the concept of relative color coordinates is often used, which can be calculated using the following formulas:
It is easy to see that x+y+z=1, which means that any pair of values is sufficient to uniquely set relative coordinates, and the corresponding color space can be represented as a two-dimensional graph:
The set of colors defined in this way is called the CIE triangle.
It is easy to see that the CIE triangle describes only the hue, but does not describe the brightness in any way. To describe the brightness, an additional axis is introduced, passing through a point with coordinates (1/3; 1/3) (the so-called white point). The result is a CIE color body (see Fig.):
This solid contains all the colors visible to the average observer. The main disadvantage of this system is that using it, we can only state the coincidence or difference of two colors, but the distance between two points of this color space does not correspond to the visual perception of the color difference.
Model CIELAB
The main goal in the development of CIELAB was to eliminate the non-linearity of the CIE XYZ system from the point of view of human perception. The abbreviation LAB usually refers to the CIE L*a*b* color space, which is currently the international standard.In the CIE L*a*b system, the L coordinate means lightness (in the range from 0 to 100), and a,b coordinates- indicate a position between green-magenta, and blue-yellow colors. Formulas for converting coordinates from CIE XYZ to CIE L*a*b* are given below:
where (Xn,Yn,Zn) are the coordinates of the white point in CIE XYZ space, and
On Fig. slices of the CIE L*a*b* color body are presented for two lightness values:
Compared to CIE XYZ system Euclidean distance (√((L1-L2)^2+(a1^*-a2^*)^2+(b1^*-b2^*)^2)) in CIE L*a system *b* matches the human perceived color difference much better, however the standard color difference formula is the extremely complex CIEDE2000.
Television color difference color systems
In the YIQ and YUV color systems, color information is represented as a luminance signal (Y) and two color difference signals (IQ and UV, respectively).The popularity of these color systems is due primarily to the advent of color television. Because Since the Y component essentially contains the original image in grayscale, the signal in the YIQ system could be received and correctly displayed both on old black-and-white TVs and on new color ones.
The second, perhaps more important, advantage of these spaces is the separation of information about the color and brightness of the image. The fact is that the human eye is very sensitive to changes in brightness, and much less sensitive to changes in color. This allows the transmission and storage of chrominance information with reduced depth. It is on this feature of the human eye that the most popular image compression algorithms (including jpeg) are built today. To convert from RGB space to YIQ, you can use the following formulas:
Since ancient times, color theorists have developed their ideas and understanding of the interaction of color. The first attempts to systematize views were made during the lifetime of Aristotle (384-322 BC), but the most serious research in the theory of color began under Leonardo da Vinci (1452-1519). Leonardo noticed that certain colors reinforce each other and discovered contrasting (opposite) and complementary colors.
The first color wheel was invented by Isaac Newton (1642-1727). He divided a beam of white light into red, orange, yellow, green, blue, indigo, and violet, and then connected the ends of the spectrum into a color wheel. He noticed that when two colors are mixed from opposite positions, a neutral color is obtained.
Thomas Young (1773-1829) proved that in reality a white light beam is decomposed into only three spectral colors: red, green and blue. These three colors are original. Based on his work, the German physiologist Hermann Helmholtz (1821-1894) showed that the human eye perceives color as a combination of red, green and blue light waves. This theory proved that our brain "breaks down" the color of each object into different percentages of red, green and blue in it, and it is because of this that we perceive different colors in different ways.
Johann Wolfgang Goethe (1749-1832) divided colors into two groups. He included warm colors (red-orange-yellow) in the positive group and cool colors (green-blue-violet) in the negative group. He found that the colors of the positive group evoke an uplifting mood in viewers, while the colors of the negative group are associated with feelings of unsettledness.
Wilhelm Ostwald (1853-1932), a Russian-German chemist, in his book The ABC of Color (1916) developed a color system depending on psychological harmony and order.
Itten Johans (1888-1967), a Swiss color theorist, developed color schemes and modified the color wheel, which was based on the three primary colors red, yellow and blue, and included twelve hues. In his experiments, he explored the relationship between color and visual effects.
In 1936, the American artist Albert Munsell (1858-1918) created a new universal color model. It is called the "Munsell Tree", where the shades are arranged along the branches of various lengths in order of their saturation. Munsell's work has been adopted by American industry as the standard for naming colors.
Color harmony
A successful combination of colors can be referred to as "color harmony". Whether they are made up of similar colors that give a softer feel to the eye or contrasting colors that catch the eye, harmonious color combinations are a matter of personal taste. The practice of art and design puts forward theories of color, the principles of the use of color, which allow you to make a decision regarding the choice of a particular color.
A color evokes an emotional and physical response, but the nature of the response can be changed by placing the original color in combination with one or more colors. Color combinations can be varied to create combinations that are related or contrasting and thus affect the viewing experience.
Basic concepts
Complementary colors (optional)
The colors are opposite each other in color wheel. They give the most contrasting combination. Using two opposite colors will result in a visual vibrancy and arousal to the eye.
Close colors + complimentary (contrasting)
One color is accompanied by two colors located in the immediate neighborhood of the color opposite the main one. Softening the contrast results in intricate color combinations.
Dual Complementary Colors
They are a combination of two pairs of complementary colors. Since the colors involved in such a combination enhance the apparent intensity of each of them, some pairs may be unpleasant to the eye. When using 4 colors, avoid color patches of the same area.
Close colors
These are combinations of two or more colors that are in close proximity on the color wheel. They have a similar wavelength, which makes them easy to read.
Process colors
This is a combination of any three colors evenly spaced on the color wheel. Triads of primary colors are perceived more sharply, secondary and tertiary triads give a softer contrast.
monochromatic colors
These are color schemes made up of shades of the same color. Use one color, explore a variety of saturation and transparency.
