How to set up smartphones and PCs. Informational portal
  • home
  • news
  • RGB description. RGB, CMYK, XYZ and other color schemes for images

RGB description. RGB, CMYK, XYZ and other color schemes for images

  • Translation

I'm going to take a tour of the history of the science of human perception, which led to the creation of modern video standards. I will also try to explain the commonly used terminology. In addition, I will briefly explain why the typical process of making a game over time will more and more resemble the process used in the film industry.

Pioneers of color perception research

Today we know that the human retina contains three different types of photoreceptor cells called cones. Each of the three types of cones contains a protein from the opsin family of proteins that absorbs light in different parts of the spectrum:

Light absorption by opsins

Cones correspond to the red, green, and blue portions of the spectrum and are often referred to as long (L), medium (M), and short (S) according to the wavelengths to which they are most sensitive.

One of the first scientific works on the interaction of light and the retina was Isaac Newton's Hypothesis Concerning Light and Colors, written between 1670-1675. Newton had a theory that light at different wavelengths caused the retina to resonate at the same frequencies; these vibrations were then transmitted through the optic nerve to the sensorium.


“Beams of light, falling on the bottom of the eye, excite vibrations in the retina, which propagate along the fibers of the optic nerves to the brain, creating a sense of sight. Different types of rays create vibrations of different strengths, which, according to their strength, excite sensations of different colors ... "

More than a hundred years later, Thomas Jung came to the conclusion that since the resonance frequency is a system-dependent property, there must be an infinite number of different resonance systems in the retina to absorb light of all frequencies. Jung considered this unlikely, and reasoned that the number is limited to one system for red, yellow and blue. These colors have traditionally been used in subtractive paint mixing. In his own words:

Since, for the reasons indicated by Newton, it is possible that the movement of the retina has an oscillatory rather than a wave nature, the frequency of oscillations should depend on the structure of its substance. Since it is almost impossible to believe that each sensitive point of the retina contains an infinite number of particles, each of which is capable of oscillating in perfect agreement with any possible wave, it becomes necessary to assume that the number is limited, for example, by three primary colors: red, yellow and blue ...
Young's hypothesis about the retina was wrong, but he made the correct conclusion: there are a finite number of cell types in the eye.

In 1850, Hermann Helmholtz was the first to obtain experimental proof of Young's theory. Helmholtz asked the subject to match the colors of different light source samples by adjusting the brightness of several monochrome light sources. He came to the conclusion that in order to compare all samples, three light sources are necessary and sufficient: in the red, green and blue part of the spectrum.

The birth of modern colorimetry

Fast forward to the early 1930s. By that time, the scientific community had a fairly good understanding of the inner workings of the eye. (Although it took another 20 years for George Wald to experimentally confirm the presence and function of rhodopsins in the retinal cones. This discovery led him to the Nobel Prize in Medicine in 1967.) Commission Internationale de L "Eclairage (International Commission on Illumination), CIE, set the task of creating a comprehensive quantification of human perception of color based on experimental data compiled by William David Wright and John Guild with parameters similar to those first chosen by Hermann Helmholtz. Baseline settings were 435.8 nm for blue, 546, 1 nm for green and 700 nm for red.


Experimental setup by John Gild, three knobs adjust primary colors

Due to the significant overlap in the sensitivity of the M and L cones, it was impossible to match some wavelengths with the blue-green part of the spectrum. To "match" these colors as a reference point, it was necessary to add a little basic red color:

If we imagine for a moment that all primary colors contribute negatively, then the equation can be rewritten as follows:

The result of the experiments was a table of RGB triads for each wavelength, which was displayed on the graph as follows:


CIE 1931 RGB color matching functions

Of course, colors with a negative red component cannot be displayed using CIE primaries.

We can now find the trichromic coefficients for the light of the spectral intensity distribution S as the following inner product:

It may seem obvious that the sensitivity to different wavelengths can be integrated in this way, but in fact it depends on the physical sensitivity of the eye, linear with the sensitivity to the wavelength. This was empirically confirmed in 1853 by Hermann Grassmann, and the integrals presented above in their modern form are known to us as Grassmann's law.

The term "color space" arose because the primary colors (red, green and blue) can be considered the basis of vector space. In this space, various colors perceived by a person are represented by rays emanating from a source. The modern definition of vector space was introduced in 1888 by Giuseppe Peano, but more than 30 years earlier, James Clerk Maxwell had already used nascent theories of what would later become linear algebra to formally describe the trichromatic color system.

The CIE decided that, in order to simplify the calculations, it would be more convenient to work with a color space in which the coefficients of the primary colors are always positive. The three new primary colors were expressed in RGB color space coordinates as follows:

This new set of primary colors cannot be realized in the physical world. It's just a math tool to make color space easier to work with. In addition, so that the primary color ratios are always positive, the new space is arranged so that the Y color ratio corresponds to the perceived luminance. This component is known as CIE brightness(You can read more about it in Charles Poynton's excellent Color FAQ article).

To make it easier to render the resulting color space, we'll do one last transformation. By dividing each component by the sum of the components, we get a dimensionless color value, independent of its brightness:

The x and y coordinates are known as chromaticity coordinates, and together with the Y CIE luma, they constitute the xyY CIE color space. If we plot the chromaticity coordinates of all colors with a given brightness on the graph, we get the following diagram, which you are probably familiar with:


XyY Chart CIE 1931

And the last thing to know is what counts as white in the color space. In such a display system, white is the x and y coordinates of a color, which are obtained when all the coefficients of the primary RGB colors are equal.

Over time, several new color spaces have emerged that have improved the CIE 1931 spaces in various respects. Despite this, the xyY CIE system remains the most popular color space for describing the properties of display devices.

Transfer functions

Before considering video standards, two more concepts need to be introduced and explained.

Optoelectronic transfer function

The optical-electronic transfer function (OETF) determines how the linear light captured by the device (camera) should be encoded into the signal, i.e. this is a function of the form:

V used to be an analog signal, but now, of course, it is digitally encoded. Usually, game developers rarely come across an OETF. One example where function would be important is the need to combine video recording with CGI in a game. In this case, you need to know which OETF the video was recorded with in order to reconstruct the linear light and mix it correctly with the computer image.

Electron-optical transfer function

The electronic-optical transfer function (EOTF) performs the opposite task of the OETF, i.e. it determines how the signal will be converted to linear light:

This feature is more important to game developers because it determines how the content they create will be displayed on users' TVs and monitors.

Relationship between EOTF and OETF

Although the concepts of EOTF and OETF are interrelated, they serve different purposes. OETF is needed to represent the captured scene, from which we can then reconstruct the original linear lighting (this representation is conceptually a HDR (High Dynamic Range) frame buffer of a normal game). What happens during the production stages of a conventional film:
  • Capturing scene data
  • Inverting OETF to Recover Linear Illumination Values
  • Color correction
  • Mastering for various target formats (DCI-P3, Rec. 709, HDR10, Dolby Vision, etc.):
    • Reducing the dynamic range of material to match the dynamic range of the target format (tone mapping)
    • Converting to the color space of the target format
    • Invert the EOTF for the material (when using EOTF in the display device, the image is restored as needed).
A detailed discussion of this workflow will not be included in our article, but I recommend that you study a detailed formalized description of the ACES (Academy Color Encoding System) workflow.

Until now, the standard technical process of the game looked like this:

  • Rendering
  • HDR frame buffer
  • Tonal correction
  • Invert EOTF for intended display device (usually sRGB)
  • Color correction
Most game engines use the color grading method popularized by Naty Hoffman's presentation "Color Enhancement for Videogames" from Siggraph 2010. This method was practical when only the target SDR (Standard Dynamic Range) was used, and it allowed software to be used for color grading. already installed on the computers of most artists, such as Adobe Photoshop.


Standard SDR Color Grading Workflow (Image courtesy of Jonathan Blow)

After the introduction of HDR, most games began to move towards a workflow similar to that used in film production. Even without HDR, a cinematic-like workflow optimized performance. Doing color grading in HDR means you have the entire dynamic range of your scene. In addition, some effects become possible that were previously unavailable.

We are now ready to look at the various standards currently used to describe TV formats.

Video standards

Rec. 709

Most of the standards related to broadcasting video signals are issued by the International Telecommunication Union (ITU), a UN body primarily concerned with information technology.

Recommendation ITU-R BT.709, more commonly referred to as Rec. 709 is a standard that describes the properties of HDTVs. The first version of the standard was released in 1990, the last in June 2015. The standard describes parameters such as aspect ratios, resolutions, frame rates. Most people are familiar with these characteristics, so I will not cover them and focus on the sections of the standard dealing with color reproduction and brightness.

The standard details the chromaticity limited by the xyY CIE color space. The red, green and blue light sources of a compliant display must be selected so that their individual chromaticity coordinates are as follows:

Their relative intensity should be adjusted so that the white point has chromaticity.

(This white point is also known as the CIE Standard Illuminant D65 and is analogous to capturing the chromaticity coordinates of the spectral intensity distribution of normal daylight.)

The chromaticity properties can be visualized as follows:


The coverage of Rec. 709

The area of ​​the color scheme, bounded by the triangle created by the primary colors of a given display system, is called the gamut.

Now we get to the luminance part of the standard, and this is where things get a little more complicated. The standard states that "General optoelectronic transfer characteristic in the source" is equal to:

There are two problems here:

  1. There is no specification for what physical brightness corresponds to L = 1
  2. Despite the fact that this is a video broadcasting standard, it does not specify the EOTF
This happened historically, because it was believed that the display device, i.e. consumer tv and there is EOTF. In practice, this has been accomplished by adjusting the captured luminance range in the above OETF so that the image looks good on a reference monitor with the following EOTF:

Where L = 1 corresponds to a brightness of about 100 cd / m² (the unit of cd / m² is called “nit” in this industry). This is confirmed by the ITU in the latest versions of the standard with the following comment:

In standard manufacturing practice, the image source encoding function is adjusted so that the final image has the desired appearance, corresponding to that visible on the reference monitor. The decoding function from Recommendation ITU-R BT.1886 is taken as a reference. A reference viewing environment is specified in Recommendation ITU-R BT.2035.
Rec. 1886 is the result of work on the documentation of the characteristics of CRT monitors (the standard was published in 2011), i.e. is a formalization of existing practice.


Elephant graveyard CRT

The nonlinearity of brightness as a function of applied voltage has led to the physical structure of CRT monitors. By pure coincidence, this nonlinearity is (very) approximately the inverted nonlinearity of human perception of brightness. When we switched to digital representation of signals, this led to the successful effect of uniformly distributing the sampling error over the entire luminance range.

Rec. 709 is designed to use 8-bit or 10-bit encoding. Most content uses 8-bit encoding. For it, the standard specifies that the distribution of the signal brightness range should be distributed in codes 16-235.

HDR10

When it comes to HDR video, there are two main contenders: Dolby Vision and HDR10. In this article, I will focus on HDR10 because it is an open standard that has quickly become popular. This standard is chosen for the Xbox One S and PS4.

We'll start again by looking at the portion of the color space used in HDR10 as defined in ITU-R BT.2020 (UHDTV) Recommendation. It contains the following chromaticity coordinates of the primary colors:

Again, D65 is used as the white point. When rendered on a schematic xy Rec. 2020 looks like this:


The coverage of Rec. 2020

Obviously, it is noticeable that the coverage of this color space is much larger than that of Rec. 709.

Now we get to the section of the standard about luminance, and this is where things get more interesting again. In his 1999 Ph.D. thesis “Contrast sensitivity of the human eye and its effect on image quality”("The Contrast Sensitivity of the Human Eye and Its Impact on Image Quality") Peter Barten presented a slightly daunting equation:

(Many of the variables in this equation are themselves complex equations, for example, the brightness is hidden inside the equations that calculate E and M).

The equation determines how sensitive the eye is to changes in contrast at different brightness levels, and different parameters determine the viewing conditions and some properties of the observer. "Minimum distinguishable difference" The (Just Noticeable Difference, JND) is the opposite of Barten's equation, so for EOTF sampling to get rid of view constraints, the following must be true:

The Society of Motion Picture and Television Engineers (SMPTE) decided that Barten's equation would be a good basis for a new EOTF. The result was what we now call SMPTE ST 2084 or Perceptual Quantizer (PQ).

PQ was created by choosing conservative values ​​for the parameters of the Barten equation, i.e. expected typical viewing conditions by the consumer. Later, PQ was defined as sampling that, for a given range of brightness and number of samples, most closely matches the Barten equation with the selected parameters.

The discretized EOTF values ​​can be found using the following recursive formula for finding k< 1 ... The last sampling value will be the required maximum brightness:

For a maximum brightness of 10,000 nits using 12-bit sampling (as used by Dolby Vision), the result looks like this:


EOTF PQ

As you can see, sampling does not cover the entire luminance range.

The HDR10 standard also uses EOTF PQ, but with 10-bit sampling. This is not enough to stay below Barten's threshold in the 10,000 nits luminance range, but the standard allows metadata to be embedded in the signal to dynamically adjust peak luminance. Here's what 10-bit PQ sampling looks like for different brightness ranges:


Various EOTF HDR10

Even so, the brightness is slightly above the Barten threshold. However, the situation is not as bad as it might seem from the graph, because:

  1. The curve is logarithmic, so the relative error is actually not that great
  2. Do not forget that the parameters taken to create the Barten's threshold were chosen conservatively.
At the time of this writing, HDR10 TVs on the market typically have a peak brightness of 1000-1500 nits, and 10 bits are sufficient for them. It is also worth noting that TV manufacturers can decide for themselves what to do with brightness above the range they can display. Some take a hard-cut approach, others a softer one.

Here's an example of what 8-bit Rec. Sampling looks like. 709 with 100 nits peak brightness:


EOTF Rec. 709 (16-235)

As you can see, we are well above Barten's threshold, and importantly, even the most promiscuous of consumers will tune their TVs at significantly higher 100 nits peak brightness (typically 250-400 nits), which will raise the Rec. 709 is even higher.

Finally

One of the biggest differences between Rec. 709 and HDR in that the brightness of the latter is indicated in absolute values. In theory, this means that content designed for HDR will look the same on all compatible TVs. At least up to their peak brightness.

There is a popular misconception that HDR content will generally be brighter, but it will generally not. HDR movies will most often be produced in such a way that the average picture brightness is the same as for Rec. 709, but so that the brightest parts of the image are brighter and more detailed, which means that midtones and shadows are darker. Combined with the absolute values ​​of HDR brightness, this means good conditions are needed for optimal HDR viewing: in bright light, the pupil constricts, which means details in dark areas of the image will be harder to see.

Tags:

  • rgb
  • color space
  • color spaces
  • video standards
  • hdr
  • hdtv
Add tags

Lesson objectives:

  • Educational: Provide basic knowledge about the physical models of color perception of an object RGB and CMY (K). Explain the interaction of color coordinates of these models.
  • Developing : develop the ability to present research results in a given format
  • Educational: develop the skills of independent completion of the task, develop aesthetic taste, show a creative attitude to work

Lesson Objectives:

  • Review: the purpose and main functions of a graphics editor, principles of image formation in raster and vector graphics
  • Learn to identify primary colors using color models
  • Check the assimilation of the material. Analyze the identified errors.

As a result of studying the topic, students should:

know:

  • physical models of color perception of an object RGB and CMY (K)
  • ratio of RGB and CMY models

be able to:

  • define colors according to a given color scheme

Equipment: PC, PowerPoint, multimedia projector, interactive whiteboard, handouts, “Color Models” presentation.

During the classes

Lesson plan

  1. Organizational moment (2 min)
  2. Frontal poll (3 min)
  3. Explaining the new material (19 min)
  4. View presentation (8 min)
  5. Checking the assimilation of the material (10 min)
  6. Summing up the lesson (1 min).
  7. Homework (2 min)

LESSON 45 min

1. Organizational moment ( 2 minutes).

  • Verification of those present
  • Magazine design
  • Introducing students to the topic of the lesson

2. Frontal poll (3 min).

Students from the field must answer the questions:

a) the purpose of the graphic editor

Graphics editor - a program (or software package) that allows you to create and edit images using a computer.

b) principles of image formation in raster and vector graphics

In raster graphics, an image is represented by a two-dimensional array of points (raster elements), the color and brightness of each of which is set independently. Pixel is the basic element of all bitmaps. Vector graphics describe an image using mathematical formulas.

c) Explanation of the new material ( 19 minutes )

Teacher: It is believed that our human eye is capable of distinguishing about 16 million shades of color. A natural question arises, how to explain to the computer that one object is red and the other pink? What is the difference between them, so clearly distinguishable by our eyes. For a formal description of color, several color models and corresponding coding methods have been invented.

Let's write the definition in a notebook:

The way in which a hue is divided into its constituent components is called a color model.

Today we will look at the RGB and CMY (K) models.

Rewrite this in your notebook.

RGB color model(abbreviation of English words R ed, G reen, B lue - red, green, blue) - additive color model.

Is used for emitted light , i.e. when preparing screen documents.

The choice of primary colors is due to the physiological features of color perception by the retina of the human eye.

Any color can be represented as a combination of 3 primary colors R ed (red), G reen (green) B lue (blue). These colors are called color components.

Additive the model is called because colors are obtained by additions to black.

Write down the primary colors in a notebook. (Students copy material from the board)

Teacher: The word additive (addition) emphasizes that the color is obtained by adding the points of three basic colors, each with its own brightness. The brightness of each base color can take values ​​from 0 to 255 (256 values), so the model can encode 2563 or about 16.7 million colors. These triplets of base points (luminous points) are located very close to each other, so that each triplet merges for us into a large point of a certain color. The brighter the colored point (red, green, blue), the more this color will be added to the resulting (triple) point.

Look at the board and the material given out.

An RGB model is displayed on the interactive whiteboard (a similar scheme in the handout for each student). The teacher continues to explain and shows on the diagram.

An image in this color model consists of three channels.

  • Pure red can be defined as (255,0,0) - R ed
  • Pure green (0.255.0) - G reen
  • Pure vivid blue (0,0,255) - B lue

In the diagram, you can see that when mixing the primary colors (red, green and blue are considered primary colors), we get

  • when mixing blue (B) and red (R), we get purple or purple (M magenta)
  • when mixing green (G) and red (R) - yellow (Y yellow)
  • when mixing green (G) and blue (B) - cyan (C cyan)
  • when mixing all three color components, we get white (W)
  • If the brightness of all three basic colors is minimal (equal to zero), it turns out black point (Black - (0,0,0))
  • If the brightness of all three colors is maximum (255), when they are added, you get white point (White - (255,255,255)
  • If the brightness of each base color is the same, it turns out gray dot (the higher the brightness value, the lighter).

A point of some beautiful, juicy color is obtained if, when mixing one (or two) colors, it is much less than two (one) others. For example, the color lilac is obtained if we take the maximum of red and blue colors. and let's not take green and yellow is achieved by mixing red and green.

Graphic information input devices (scanner, digital camera) and output device (monitor) operate in this particular model.

Color model RGB has a wider gamut in many color tones (can represent richer colors) than typical CMYK gamut, so sometimes images that look great in RGB fade and fade significantly in the CMYK model, which we'll now look at.

Color model CMY ( K)

Colored non-luminous objects absorb part of the white light spectrum that illuminates them and reflect the remaining radiation. Objects reflect different colors (colored in them) depending on the region of the spectrum where absorption occurs.

The name of the model and the base colors are already written on the board.

CMY ( K )
C yan M agenta Y ellow blac K
Cyan Magenta Yellow Black

Rewrite this in your notebook.

Colors that use white light by subtracting certain parts of the spectrum from it are called subtractive ("subtractive") ... To describe them, use subtractive model CMY (C is Cyan, M is Magenta, Y is Yellow). In this model, the primary colors are formed by subtracting the additive primary colors of the RGB model from white.

Subtracting the three primary RGB colors from white gives us three complementary CMY colors.

In this case, there will be three main subtractive colors:

  • blue (white minus red)
  • magenta (white minus green)
  • yellow (white minus blue)

Color model CMY ( K ) used when working with reflected color (when printing) .

When two subtractive (subtracted) components are mixed, the resulting color is darkened (more light is absorbed, more paint is put in). In this way:

  • when mixing the maximum values ​​of all three components, you should get black color
  • in the complete absence of paint (zero values ​​of the components), the color will turn out to be white (white paper)
  • shifting the equal values ​​of the three components will give shades of gray.

This model is the main printing model. Magenta, cyan, yellow colors make up the so-called polygraphic triad , and when printed with these inks, most of the visible color spectrum can be reproduced on paper.

However, real paints have impurities, their color may not be ideal, and the mixing of the three base paints, which should give black, results in an undefined mud brown instead (look at the material given). In addition, to obtain an intense black, you need to put a large amount of ink of each color on the paper. This will overwet the paper and reduce print quality. In addition, the use of large quantities of paint is uneconomical.

To improve the quality of the print in the number of basic printing inks (and in the model) added black paint. It was she who added the last letter to the CMYK model name, although not quite usually. The black component is reduced to the letter K, since this paint is the main, key ( K ey) during color printing (or blac K).

As with the RGB model, the amount of each component can be expressed as a percentage or gradation from 0 to 255.

Printing with four CMYK inks, also called printing process paints.

Color in CMYK depends not only on the spectral characteristics of the dyes and on the method of their application, but also on their quantity, characteristics of the paper and other factors. In fact, CMYK numbers are just a set of phototypesetting hardware data and do not uniquely define color.

Color circle

When processing images, it is necessary to clearly understand the interaction of the color coordinates of the additive RGB system and the subtractive CMYK system. Without knowing these patterns, it is difficult to assess the quality of color, to assign corrective operations, and it is simply reasonable to use the simplest tools designed to work with color.

If these two models are presented in the form uniform model then it will turn out truncated a variant of the color wheel, in which the colors are arranged in the order known from school (only without the derived orange color): red (R), yellow (Y), green (G), cyan (C), blue (B) - purple (lilac , purple) M - Magenta

EVERY HUNTER WANTS TO KNOW WHERE THE PHASAN IS SITTING
or
LIKE ONCE JEAN - ZONAR'S HEAD FILLED THE LANTERN
or
EVERY DESIGNER WISHES TO KNOW WHERE TO DOWNLOAD PHOTOSHOP

Consider the simplest and most popular model, called the color wheel. It contains the coordinates of the main color systems RGB and CMYK at the same distance from each other.

Pairs of colors located at the ends of the same diameter (at an angle of 180 degrees) are called
On the color wheel, the primary colors of the RGB and CMY models are in the following relationship: each color is located opposite a complementary (complementary) color; while he is at an equal distance between the colors with which it was obtained.

Complimentary colors are:

  • green and purple,
  • blue and yellow,
  • blue and red.

Complementary colors are, in a sense, mutually exclusive. Adding any paint to the color wheel compensates for the additional paint, as it were, dilutes it in the resulting color.

For example, to change the color ratio towards green tones, you should lower the magenta color, which is complementary to green.

This statement can be expressed in the following short formulas:

The teacher writes on the board:

Now write down the remaining 5 formulas yourself in a notebook:

100% Magenta = 0Green

100% Yellow = 0Blue

0% Magenta = 255Green

0% Yellow = 255Blue.

Listen and write down the sentence in a notebook:

Cyan is the opposite of red because cyan dyes absorb red and reflect blue and green. Blue is the absence of red.

The instructor asks 5 students to reformulate the sentence for the remaining 5 colors.

Here is a summary of the basic and derived rules for color synthesis using a circular model (see handout):

  • Each subtractive (additive) color is between two additive (subtractive) colors.
  • Adding any two RGB (CMY) colors produces a CMY (RGB) color that lies in between. For example, mixing green and blue makes cyan, and mixing yellow and magenta makes red.

Write down all possible ratios of this kind in a notebook yourself (6 formulas)

Red + Green = Yellow

Blue + Green = Cyan

Red + Blue = Magenta

Cyan + Magenta = Blue

Cyan + Yellow = Green

Magenta + Yellow = Red.

  • Superimposing red and green at maximum intensity produces pure yellow. Decreasing the intensity of red shifts the resulting color towards green, while reducing the contribution of green makes the color orange.
  • Mixing blue and red in maximum proportion gives purple. Decreasing the amount of blue will shift the color towards pink, while decreasing the amount of red will shift the color towards magenta.
  • Green and blue form cyan. There are about 65 thousand different shades of blue that can be synthesized by mixing these color coordinates in different proportions.
  • Overprinting cyan and magenta at the highest density produces deep blues.
  • Magenta and yellow dyes produce red. The higher the density of the components, the higher its brightness. Decreasing magenta gives the color an orange tint, decreasing the yellow component gives pink; Yellow and blue give a bright green color. A decrease in the proportion of yellow gives rise to emerald, and a decrease in the contribution of blue produces light green.
  • Lightening or darkening a color of extreme saturation reduces its saturation.

Let's write in a notebook:

Color nesting can be increased and decreased by adjusting its contributions complimentary colors or related colors.

4. Viewing the presentation ( 8 minutes)

Now we will watch the presentation to consolidate the material covered and find out what awaits us in the next lessons.

5. Checking the assimilation of the material ( 10 min)

I ask you to answer questions on a new topic:

1. List the base colors of the RGB and CMY (K) models.

  • RGB color model - Red, Green, Blue - red, green, blue
  • Color model CMY- C is Cyan, M is Magenta, Y is Yellow

2. What color model is used for the emitted color?

3. Why is it called additive?

The additive model is called because colors are obtained by adding (English addition) to black

4. What does the letter K mean in the CMYK color model?

The black component, since this paint is the main, key ( K ey) during color printing (or blac K).

5. What is the color wheel model used for?

To understand the interaction of RGB color coordinates and CMYK subtractive system.

6. What colors are called complimentary?

Pairs of colors located at the ends of the same diameter on the color wheel (at an angle of 180 degrees) are called complimentary or complementary.

  • List complimentary colors.
  • green and purple
  • blue and yellow
  • blue and red.

6. Summing up the lesson ( 1 minute).

Our lesson is coming to an end. Today you learned about the RGB and CMY (K) color models, the base colors of these models, the interaction of the color coordinates of the RGB additive system and the CMYK subtractive system. We will continue our acquaintance with color models in the next lesson.

7. Homework ( 2 minutes)

Write down your homework:

  1. Using the Color wheel model, repeat the basic formulas for obtaining color
  2. Profile school “Technology of processing textual information. Technology for processing graphic and multimedia information "AV Mogilev, LV Listratova SPb .: BHV-Petersburg, 2010 p. 8.2.
  3. Computer graphics lessons. CorelDRAW. Training course L. Levkovets SPb .: Peter, 2006 level 2

A color TV or your computer monitor is based on the principle of such a division of light. To put it very roughly, the monitor you are currently looking at consists of a huge number of points (their number vertically and horizontally determines the monitor's resolution) and three "lights" are shining at each point: red, green and blue. Each "light bulb" may shine with different brightness, or may not shine at all. If only the blue "light" is shining, we see a blue dot. If only red, we see a red dot. Likewise with green. If all the bulbs shine with full brightness at one point, then this point turns out to be white, since all the gradations of this white are again brought together. If not a single light bulb is shining, then the point appears to us to be black. Since black is the absence of light. By combining the colors of these "bulbs" that glow with different brightness, you can get different colors and shades.

The brightness of each such light bulb is determined by the intensity (division) from 0 (off "light") to 255 ("light" shining with full "strength"). This division of colors is called the RGB color model from the first letters of the words "RED" "GREEN" "BLUE" (red, green, blue).


In this way White color our point in the RGB color model can be written as follows:

R (from the word "red", red) - 255

G (from the word "green", green) - 255

B (from the word "blue", blue) - 255


A "saturated" red would look like this:



The yellow color will look like this:


Also, to write color in rgb, use the hexadecimal system. The intensities are shown in the order #RGB:

White - #ffffff

Red - # ff0000

Black - # 00000

Yellow - # ffff00

CMYK color model

So, now we know in what cunning way our computer gives us the color of a particular point. Let's now use the acquired knowledge and try to get white color using paints. To do this, buy gouache in the store, take jars of red, blue and green paint, and mix them. Happened? And I have not.

The problem is that our monitor emits light, that is, it glows, but in nature, many objects do not have this property. They simply reflect the white light that falls on them. Moreover, if an object reflects the entire spectrum of white light, then we see it as white, but if part of this light is absorbed by it, then not quite.

Something like this: we shine white light on a red object. White light can be thought of as R-255 G-255 B-255. But the object does not want to reflect all the light that we have directed at it, and brazenly steals all shades of green and blue from us. As a result, it reflects only R-255 G-0 B-0. That is why it looks red to us.

So it is very problematic to use the RGB color model for printing on paper. For this, as a rule, the color model CMY (tsmi) or CMYK (tsmik) is used. The CMY color model is based on the fact that a sheet of paper itself is white, that is, it reflects almost the entire RGB spectrum, and the paints applied to it act as filters, each of which "steals" its own color (either red or green, or blue). Thus, the colors of these paints are determined by subtracting one RGB color from white. The resulting colors are Cyan (something like blue), Magenta (you could say pink), Yellow (yellow).


And if in the RGB color model each color was graded in brightness from 0 to 255, then in the CMYK color model the main value for each color is "opacity" (the amount of paint) and is determined by percentages from 0% to 100%.


Thus, white can be described as follows:

C (cyan) - 0%; M (magenta) - 0%; Y (yellow) - 0%.

Red - C-0%; M-100%; Y-100%.

Green - C-100%; M-0%; Y-100%.

Blue - C-100%; M-100%; Y-0%.

Black - C-100%; M-100%; Y-100%.

However, this is only possible in theory. But in practice, it is impossible to do with CMY colors. And when printing black, it turns out to be rather dirty brown, gray does not look like itself, and it is problematic to create dark shades of colors. Another paint is used to adjust the final color. Hence the last letter in the name CMYK (CMYK). The decoding of this letter can be different:

It can be short for blacK (black). And in the abbreviation, it is the last letter that is used, so as not to confuse this color with the Blue color in the RGB model;

Printers often use the word "Contour" in relation to this color. So it is possible that the letter K in CMYK (CMYK) is an abbreviation for the German word "Kontur";

It can also be short for Key-color.

However, it is difficult to call it key, since it is rather additional. And this color is not quite similar to black. If you print with this ink only, the image turns out to be rather gray. Therefore, some are of the opinion that the letter K in CMYK stands for "Kobalt" (German for dark gray).

Typically, the term "black" or "black" is used to refer to this color.

Printing using CMYK colors is called "full color" or "process".

* It is probably worth saying that when printing CMYK (CMYK) colors do not mix. They lie on the paper as "spots" (raster) one next to the other and are mixed already in the imagination of a person, because these "spots" are very small. That is, the image is rasterized, since otherwise the paint, falling one on top of the other, spreads out and moiré or dirt is formed. There are several different rasterization methods.


Grayscale color model

Many people mistakenly call the image in the grayscale color model black and white. But this is not the case. A black and white image consists of only black and white tones. While grayscale has 101 shades. This is the Kobalt color gradation from 0% to 100%.


Device-dependent and device-independent color models

The CMYK and RGB color models are device dependent, that is, they depend on how color is conveyed to us. They tell a specific device how to use their respective dyes, but have no knowledge of how humans perceive the final color. Depending on the brightness, contrast and sharpness settings of the computer monitor, the room illumination, the angle at which we look at the monitor, we perceive a color with the same RGB parameters differently. A person's perception of color in the "CMYK" color model depends on an even wider range of conditions, such as the properties of the printed material (for example, glossy paper absorbs less ink than matte paper, respectively, the colors on it are brighter and more saturated), peculiarities of ink, air humidity , at which the paper dried, the characteristics of the printing press ...

To convey to a person more reliable information about a color, so-called color profiles are attached to device-dependent color models. Each of such a profile contains information about a specific method of transmitting color to a person and adjusts the final color by adding or removing parameters from any component of the initial color. For example, for printing on glossy films, a color profile is used that removes 10% Cyan and adds 5% Yellow to the original color, due to the peculiarities of the particular press, the film itself, and other conditions. However, even attached profiles do not solve all the problems of transferring color to us.

Hardware-independent color models do not convey color information to humans. They describe mathematically the color perceived by a person with normal color vision.

HSB and HLS color models

At the heart of this color space is the already familiar RGB rainbow ring. Color is controlled by changing parameters such as:

Hue- shade or tone;

Saturation- color saturation;

Brightness- brightness.


The hue parameter is the color. Defined in degrees from 0 to 360 based on the colors of the rainbow ring.

The saturation parameter - the percentage of adding white paint to this color has a value from 0% to 100%.

The Brightness parameter - the percentage of adding black paint also varies from 0% to 100%.

The principle is similar to one of the representations of light from the point of view of fine art. When white or black paint is added to the existing colors.

This is the easiest color model to understand and is why many web designers love it. However, it has several disadvantages:

The human eye perceives the colors of the rainbow ring as colors with different brightness. For example, spectral green is brighter than spectral blue. In the HSB color model, all colors of this circle are considered to have 100% brightness, which, unfortunately, does not correspond to reality.

Since it is based on the RGB color model, it is still device-dependent.

This color model is converted to CMYK for printing and converted to RGB for display on a monitor. So guessing what color you will end up with can be very problematic.


The HLS color model is similar to this model (meaning: hue, lightness, saturation).

Sometimes used to correct light and color in an image.


LAB color model

In this color model, the color consists of:

Luminance - luminance. This is a combination of the concepts of brightness (lightness) and intensity (chrome)

A- this is a range of colors from green to purple

B- colors from blue to yellow


That is, two indicators together determine the color and one indicator determines its illumination.

LAB - This is a device independent color model, that is, it does not depend on how color is transmitted to us. It contains both RGB and CMYK colors, and grayscale, which allows it to convert an image from one color model to another with minimal loss.

Another advantage is that it, in contrast to the HSB color model, corresponds to the peculiarities of color perception by the human eye.

It is often used to improve image quality and convert images from one color space to another.



In the Russian tradition, it is sometimes referred to as KZS.

The choice of primary colors is due to the physiological features of color perception by the retina of the human eye. The RGB color model is widely used in technology.

It is called additive because colors are obtained by adding (eng. addition) to black. In other words, if the color of the screen illuminated by a colored spotlight is indicated in RGB as (r 1, g 1, b 1), and the color of the same screen illuminated by another spotlight is (r 2, g 2, b 2), then when illuminated by two spotlights, the screen color will be denoted as (r 1 + r 2 , g 1 + g 2, b 1 + b 2).

An image in this color model consists of three channels. When mixing primary colors (red, green and blue are considered primary colors) - for example, blue (B) and red (R), we get magenta (M magenta), when mixing green (G) and red (R) - yellow (Y yellow), when mixing green (G) and blue (B) - cyan (C cyan). By mixing all three color components, we get white (W).

Definition

The RGB color model was originally developed to describe color on a color monitor, but since monitors vary from model to manufacturer, several alternative color spaces have been proposed to match the “average” monitor. These include, for example, sRGB and Adobe RGB.

Variants of this color space differ in different shades of primary colors, different color temperatures, and different gamma correction values.

Representation of RGB base colors according to ITU guidelines, in kelvin space (daylight)

Red: x = 0.64 y = 0.33 Green: x = 0.29 y = 0.60 Blue: x = 0.15 y = 0.06

Matrices for converting colors between RGB and luminance systems when converting an image to black and white):

X = 0.431 * R + 0.342 * G + 0.178 * BY = 0.222 * R + 0.707 * G + 0.071 * BZ = 0.020 * R + 0.130 * G + 0.939 * BR = 3.063 * X-1.393 * Y-0.476 * ZG = -0.969 * X + 1.876 * Y + 0.042 * ZB = 0.068 * X-0.229 * Y + 1.069 * Z

Numeric representation

RGB color model represented as a cube

For most applications, the r, g, and b coordinate values ​​can be thought of as belonging to the segment, which represents the RGB space as a 1 × 1 × 1 cube.

COLORREF

COLORREF is the standard type for representing colors in Win32. Used to define RGB color. The size is 4 bytes. When defining any RGB color, the value of a variable of the COLORREF type can be represented in hexadecimal form like this:

0x00bbggrr

rr, gg, bb - intensity value, respectively, of red, green and blue components of the color. Their maximum value is 0xFF.

You can define a variable of type COLORREF as follows:

COLORREF C = (b, g, r);

b, g and r are the intensity (in the range from 0 to 255), respectively, of the blue, green and red components of the determined color C. That is, bright red can be defined as (255,0,0), bright purple - (255 , 0,255), black - (0,0,0), and white - (255,255,255)

Color and its models

Sofya Skrylina, teacher of the training center "Art", St. Petersburg

In ComputerArt No. 7 "2012, an article was presented about harmonious color combinations and patterns of influence of color on human perception, which, undoubtedly, modern designers take into account in their projects. But when working at a computer and mixing colors on a monitor screen, specific problems arise. A designer should get on a monitor screen or hard copy exactly the color, tone, tint and lightness required. Colors on the monitor do not always match natural colors. It is very difficult to get the same color on the screen, on a printout of a color printer and on a printed copy. The fact is that colors in nature, on a monitor and on a printed sheet, are created in completely different ways.
For the unambiguous definition of colors in different color environments, there are color models, which we will talk about in this article.

RGB model

The RGB color model is the most popular way to represent graphics and is suitable for describing the colors visible on a monitor, TV, video projector, as well as images created by scanning.

The RGB model is used to describe colors produced by mixing three rays: Red, Green, and Blue. The name of the model is made from the first letters of the English names of these colors. The rest of the colors are obtained by combining the base colors. Colors of this type are called additive, because when two rays of primary colors are added (mixed), the result becomes lighter. In fig. 1 shows what colors are obtained when adding the main ones.

In the RGB model, each base color is characterized by a brightness that can take 256 values ​​- from 0 to 255. Therefore, you can mix colors in different proportions, changing the brightness of each component. Thus, you can get 256x256x256 = 16,777,216 colors.

Each color can be associated with a code using decimal and hexadecimal code representations. Decimal notation is a triple of decimal numbers separated by commas. The first number corresponds to the brightness of the red component, the second to the green, and the third to the blue. Hexadecimal representation is three two-digit hexadecimal numbers, each representing the luminance of the base color. The first number (first pair of numbers) corresponds to the brightness of red, the second number (second pair of numbers) to green, and the third (third pair) to blue.

To verify this fact, open the color picker in CorelDRAW or Photoshop. In the R box, enter 255 for the maximum luminance for red, and zero in the G and B boxes. As a result, the sample field will contain red, the hexadecimal code will be: FF0000 (Fig. 2).

Rice. 2. Representation of red in the RGB model: on the left - in the Photoshop palette window, on the right - CorelDRAW

If you add green with maximum brightness to red and enter 255 in the G field, you get yellow, the hexadecimal representation of which is FFFF00.

The maximum brightness of all three basic components corresponds to white, the minimum to black. Therefore, white has the code (255, 255, 255) in decimal notation, and FFFFFF16 in hexadecimal. Black is coded accordingly (0, 0, 0) or 00000016.

All shades of gray are formed by mixing three components of the same brightness. For example, R = 200, G = 200, B = 200, or C8C8C816 produces light gray, while R = 100, G = 100, B = 100, or 64646416 produces dark gray. The darker the shade of gray you want, the lower the number you need to enter in each text box.

What happens when an image is printed, how are colors rendered? After all, paper does not emit, but absorbs or reflects color waves! When transferring a color image to paper, a completely different color model is used.

CMYK Model

When printing, ink is applied to paper - a material that absorbs and reflects color waves of various lengths. Thus, the paint acts as a filter that allows certain rays of the reflected color to pass through, subtracting all others.

The CMYK color model is used for mixing inks by printing devices - printers and printing presses. The colors of this model are obtained by subtracting the base colors of the RGB model from white. Therefore, they are called subtractive.

The following colors are basic for CMYK:

  • blue (Cyan) - white minus red (Red);
  • magenta (Magenta) - white minus green (Green);
  • yellow - white minus blue (Blue).

In addition to these, black is also used, which is the key (Key) in the process of color printing. The fact is that real paints have impurities, so their color does not correspond exactly to the theoretically calculated cyan, magenta and yellow. Mixing the three base paints, which should be black, produces a vague mud brown instead. Therefore, black is included in the number of basic printing inks.

In fig. 3 is a diagram showing what colors are obtained by mixing the base in CMYK.

It should be noted that CMYK colors are not as pure as RGB colors. This explains the slight discrepancy between the base colors. According to the diagram shown in Fig. 3, at maximum brightness, the following color combinations should be obtained:

  • mixing magenta (M) and yellow (Y) should give red (R) (255, 0, 0);
  • mixing yellow (Y) and blue (C) should give green (G) (0, 255, 0);
  • mixing magenta (M) and cyan (C) should produce blue (B) (0, 0, 255).

In practice, it turns out a little differently, which we will check later. Open the color picker dialog box in Photoshop. Enter 100% in the M and Y text boxes. Instead of the base red color (255, 0, 0), we have a red-orange mixture (Fig. 4).

Now enter 100% in the Y and C text boxes. Instead of the base green (0, 255, 0), the result is green with a slight tint of blue. When setting the brightness to 100% in the M and C fields, instead of blue (0, 0, 255), we have a blue color with a purple tint. Moreover, not all RGB colors can be represented in CMYK. RGB color gamut is wider than CMYK.

The primary colors of the RGB and CMYK models are in the dependence shown on the color wheel scheme (Fig. 5). This scheme is used for color correction of images; examples of its use were considered in ComputerArt No. 12 "2011.

RGB and CMYK models are hardware dependent. For RGB, the base color values ​​are determined by the quality of the phosphor on a CRT or by the characteristics of the backlight and panel color filters on LCD monitors. If we turn to the CMYK model, then the values ​​of the base colors are determined by the actual printing ink, the peculiarities of the printing process and the medium. Thus, the same image may look different on different equipment.

As noted earlier, RGB is the most popular and commonly used model for representing color images. In most cases, images are prepared for display via a monitor or projector and for printing on color desktop printers. In all these cases, the RGB model must be used.

Comment

Although color printers use CMYK ink, most often images that are prepared for printing need to be converted to RGB. However, the printed image will appear slightly darker than on the monitor, so it must be lightened before printing. The amount of lightness for each printer is determined empirically.

The CMYK model must be used in one case - if the image is being prepared for printing on a printing press. Moreover, it should be borne in mind that the CMYK model does not contain as many colors as the RGB model, therefore, as a result of converting from RGB to CMYK, the image may lose a number of shades that are unlikely to be restored by reverse conversion. Therefore, try to carry out the conversion of the image to CMYK model at the end of the work with it.

HSB model

The HSB model simplifies working with colors, as it is based on the principle of color perception by the human eye. Any color is determined by its Hue - the color itself, Saturation - the percentage of adding white paint to the color and Brightness - the percentage of adding black paint. In fig. 6 shows a graphical representation of the HSB model.

Spectral colors, or color tones, are located at the edge of the color wheel and are characterized by a position on it, which is determined by an angle in the range from 0 to 360 °. These colors have maximum (100%) saturation (S) and brightness (B). Saturation changes along the radius of the circle from 0 (in the center) to 100% (at the edges). At 0% saturation, any color becomes white.

Brightness is a parameter that determines lightness or darkness. All colors in the color wheel are at their maximum brightness (100%) regardless of hue. Decreasing the brightness of a color means darkening it. To display this process, a new coordinate directed downward is added to the model, on which brightness values ​​from 100 to 0% are plotted. The result is a cylinder formed from a series of circles of decreasing brightness, the bottom layer being black.

In order to verify this statement, open the color picker dialog box in Photoshop. Enter a maximum value of 100% in the S and B fields and a minimum value of 0 ° in the H field. As a result, we get the pure red color of the solar spectrum. The same color corresponds to the red color of the RGB model, its code (255, 0, 0), which indicates the relationship of these models (Fig. 7).

In the H field, change the angle value in 20 ° increments. You will receive colors in the order in which they are located in the spectrum: red will change to orange, orange to yellow, yellow to green, etc. An angle of 60 ° gives yellow (255, 255, 0), 120 ° - green (0, 255, 0), 180 ° - blue (255, 0, 255), 240 ° - blue (0, 0, 255), etc.

To get a pink color, in the language of the HSB model - a faded red, you must enter a value of 0 ° in the H field, and lower the saturation (S), for example, to 50%, setting the maximum brightness value (B).

Gray for the HSB model is zeroed hue (H) and saturation (S) with luminance (B) less than 100%. Here are examples of light gray: H = 0, S = 0, B = 80% and dark gray: H = 0, S = 0, B = 40%.

The white color is set as follows: H = 0, S = 0, B = 100%, and to get black, it is enough to reduce the brightness value to zero at any values ​​of hue and saturation.

In the HSB model, any color is obtained from the spectral color by adding a certain percentage of white and black dyes. Therefore, HSB is a very easy-to-understand model used by painters and professional artists. They usually have several base colors, and all others are obtained by adding black or white to them. However, when artists mix paints from base paints, the color goes beyond the HSB model.

Lab Model

The Lab model is based on the following three parameters: L- brightness (Lightness) and two chromatic components - a and b... Parameter a changes from dark green through gray to magenta. Parameter b contains colors from blue through gray to yellow (Fig. 8). Both components change from -128 to 127, and the parameter L- from 0 to 100. Zero value of color components at brightness 50 corresponds to gray color. A luminance value of 100 produces white, and 0 produces black.

The concepts of brightness in the Lab and HSB models are not the same. As in RGB, mixing colors from scales a and b produces brighter colors. You can reduce the brightness of the resulting color using the parameter L.

Open the color picker in Photoshop, in the brightness field L enter value 50, for parameter a enter the smallest value -128 and the parameter b reset to zero. As a result, you will get a blue-green color (Fig. 9). Now try increasing the parameter value a per unit. Please note that the numeric values ​​have not changed in any model. Try increasing the value of this parameter to achieve changes in other models. You will most likely be able to do this with a value of 121 (the green component of RGB will decrease by 1). This circumstance confirms the fact that the Lab model has b O Greater color gamut than RGB, HSB and CMYK models.

In the Lab model, the brightness is completely separated from the image, so in some cases this model is convenient to use for recoloring fragments and increasing the saturation of the image, affecting only the color components a and b... It is also possible to adjust the contrast, sharpness and other tonal characteristics of the image by changing the brightness parameter L... Examples of image correction in the Lab model were given in ComputerArt No. 3 "2012.

The Lab model has a wider color gamut than RGB, so every re-conversion from one model to another is practically safe. Moreover, you can put the image in Lab mode, perform corrections in it, and then painlessly convert the result back to RGB.

The Lab model is hardware independent, serves as the core of the color management system in the graphics editor Photoshop, and is applied in a hidden form at each transformation of color models as an intermediate one. Its color range covers both RGB and CMYK ranges.

Indexed colors

To publish an image on the Internet, not the entire color gamut, consisting of 16 million colors, as in RGB mode, is used, but only 256 colors. This mode is called Indexed Color. A number of restrictions are imposed on the work with such images. Filters cannot be applied to them, some commands for tone and color correction, all operations with layers are not available.

With an image downloaded from the Internet (usually in GIF format), the following situation often arises. You can draw something in it only with a color different from the selected one. This is because the selected color is outside the color gamut of the indexed image, that is, this color is not in the file. As a result, the color selected in the palette is replaced with the closest similar color from the color table. Therefore, before editing such an image, it is necessary to convert it to RGB.

The article was prepared on the basis of the book by Sofya Skrylina “Photoshop CS6. Most Necessary ": http://www.bhv.ru/books/book.php?id=190413.

Top related articles