SEARCH

How-To Geek

RGB? CMYK? Alpha? What Are Image Channels and What Do They Mean?

sshot-75

They’re there, lurking in your image files. But have you ever wondered what are image channels are? And what do they have to do with RGB and CMYK? Here’s the answer.

The channels panel in Photoshop is one of the most disused and misunderstood parts of the program. But images have color channels with or without Photoshop. Read on to find out what color channels are, what RGB and CMYK are, and learn a little bit more about how image files work.

Primary Colors of Light and Print

Boutet_1708_color_circles

“Primary Colors,” at least in the sense you might have learned of them in High School art class, refer to a set of pigments that can be combined in various ratios to create every color in the visible spectrum. RGB and CMYK are combinations of a different set of primary colors: the primary colors of light, and primary colors for printing. Let’s briefly look at both of these, and contrast the two of them.

2240048669_3ea63d6a6e_b

It’s a well documented property of light that it can be refracted into the various, slower wavelengths that make it up. Another observable property of light is that it can also be recombined from these various wavelengths (we call them colors) back into pure white light. Issac Newton documented this in Opticks, a book on his studies of light and the refraction of it.

The RGB color model is exactly this. Combining light from Red, Green, and Blue sources, pure white light (or the illusion of it) can be achieved on computer screens or on various kinds of television monitors. The RGB model of image is simply a way for images to track the amount of Red, Green and Blue light each pixel has. More on how, later, but first, let’s compare this light-based model to how print processes work.

Cyan, Magenta, Yellow, Keyline

rgb demo

You’re possibly only familiar with the colors listed above because you buy CMYK cartridges for your desktop printer. Cyan, Magenta, and Yellow are called the “process colors” of printing, and can be thought of as a primary set of inks. You can see from the illustration above, that they combine in various amounts to create a wide range of colors, including a mixed black.

Because mixing huge quantities of three inks can become expensive, printers decided to add black as a fourth color to this set. Black ink (known as key, or keyline, hence the “K” in “CMYK”) allows for less waste of the other three primary color, as well as richer prints with more color depth.

Do We Really Need Both?

led tvCMYK_process_ink

CMYK files may be all well and good for printers, but why can’t we just pick one and use only it? As you might have guessed, RGB and CMYK files each are used to solve their own individual problems.

RGB files work with a model that is based around light. Because of this, they are ideal image file formats for on-screen and web based design—formats that will only be viewed through light projecting monitors or televisions.

CMYK is the preferred color model when working directly for four color process print. It is possible for a designer to work in RGB files, but it doesn’t make sense to work with colors that can’t be printed. Therefore, working with CMYK can help eliminate the color shifts and various problems when translating an RGB document to a printed CMYK color gamut.

What Does All This Have to Do with Image Channels?

sshot-76

The illustration above shows Photoshop’s color picker tool. In a common 24 bit RGB image file, images are essentially made of three smaller 8 bit files. These smaller files are the image’s channels, and they have a range of 256 values, ranging from 0 – 255. You can see evidence of this in your color picker, with values broken down between Red, Green, and Blue on the left, and Cyan, Magenta, Yellow, and Keyline (black) on the right.

sshot-74

Each channel represents the amount of light (RGB) or simulated ink (CMYK) each isolated color needs to combine to create the digital image. You’ll notice, that in the RGB file illustrated above, the brightest bulbs in the corresponding channels (marked Red, Green, and Blue) are the ones for the corresponding channel. In other words, the green bulb is the brightest in the green channel because it takes more bright green light to create an image of a glowing green bulb.

Those combinations of single color, 256 color images combine color information to create millions of color tints, hues, and shades in every garden variety RGB JPG or CMYK Photoshop file.

Wait, What Are Alpha Channels?

sshot-78

Simply to make things one step more confusing, some image files (notably, like PNG) contain more image information in an extra channel. This channel is essentially no different than an RGB or CMYK channel, with 256 shades of gray representing the image areas. However, Alpha channels have on crucial difference: they denote transparency, not color information.

The image illustrated above shows the composite RGB image on the left, with information from the alpha channel shown on the right. Wherever there is white, the image is opaque. Where there is black, it is perfectly clear, like a transparent PNG. The shades of gray in between allow for transparency beyond a simple “on” and “off” switch.

Nothing else changes with an Alpha channel. It is more or less identical to any other 8-bit channel in any image, and is more or less just as easy (or as hard) to understand.


Have questions or comments concerning Graphics, Photos, Filetypes, or Photoshop? Send your questions to ericgoodnight@howtogeek.com, and they may be featured in a future How-To Geek Graphics article.

Image Credits: Prism Reflections by sburke2478. Red Eyed Tree Frog by Carey James Balboa. Led 1 by Alessandro Vannucci. CMYK Process Ink by w_lebelie.

Eric Z Goodnight is an Illustrator and Graphics Geek who hopes to make Photoshop more accessible to How-To Geek readers. When he’s not headbanging to heavy metal or geeking out over manga, he’s often off screen printing T-Shirts.

  • Published 02/2/11

Comments (11)

  1. Gianluca

    Thanks for this Article,

    was never taught it was so easy to understnad this stuff :D

  2. Hatryst

    Every designer must know this… Great piece of information !

  3. Bruce

    The article is pretty good but there is a little more to it. Cmyk is meant for print and is viewed as reflective. We see yellow because all the other colors are filtered out by the ink. Rgb is transmissive and so is additive, if you combine rgb you get white light which is why you see the colors when shined through a prism. The prism splits the rgb colors.
    The combination of ymc should give black but because of the inadequate properties of ink gives a dark brown. Also the rgb color space is much larger than can be achieved in printing. So the ymck space is smaller in size or does not reproduce as many colors as we can see. It is partially true that ymc ink is more expensive but not always. The real reason is that paper must hold the ink while it is being printed. The paper acts like a sponge and soaks the ink in. We have all seen paper that has something spilled on it. It curls and breaks easily. Therefore printers take advantage of UCR/GCR. Simply, certain values of CMY make gray and we can replace with black this in turn lowers the amount of ink on paper plus as you said black ink is blacker and gives a richer look.

  4. deckoff

    Next one I am looking for is how to use channels while editing images and so on. Great one, always been wondering, never had the time to look for this info :)

  5. BB

    Thanks, nice article. One question though: when printing, how are the lighter shades achieved? The CMYK cartridges each have a strength of colour – for example, yellow is a strong mid-yellow. How does it print a light-yellow, therefore? It can’t get lighter yellow by mixing with the M and C. And there’s no white ink to mix in. Does it simply print less of the ink on the paper, and simply rely on the whiteness of the paper to achieve the lighter shades?

    Also; in the picture of the Colour Picker, what are the H/S/B and L/a/b values? Are these values that are also stored in the 24-bit colour value, or are they stored in some other way, or are they automatically calculated from the RGB/CMYK values?

  6. Eric Z Goodnight

    I’ve one done one other article on channels, but it does show some basics.

    http://www.howtogeek.com/howto/29839/use-photoshop-channels-to-elegantly-remove-backgrounds-from-images/

    I’ll try and come up with something good for you in the future. :)

  7. Jeffrey Bennett

    Great article! Thanks for sharing! :)

  8. Eric Z Goodnight

    @BB: Those are really great questions. Let me take a crack at them.

    What you’re saying is correct, and that’s why prints take on the color of the paper. Your printer would achieve a lighter yellow simply by printing a lighter coat of yellow ink to optically create a lighter shade. In my industry, we call those lighter coats “halftones.” Same idea, except the word halftones doesn’t apply.

    HSB stands for Hue Saturation Brightness. Lab stands for Lightness Alpha Beta. They are both alternate 24 bit color modes, but they have values directly corresponding to RGB. CMYK has a conversion algorithm, which gives a color shift. HSB and Lab achieve the same colors in a 24 bit file, they’re just sort of a more abstracted way to represent those colors. It’s sort of like how Degrees and Radians can both describe angles…?

  9. Nav

    This article is a must for an artist and a graphic designer

  10. Chip W

    Helpful article. Color seems so simple but is quite a complex topic.
    This article clarified for me what a channel is, and what 24 bit color means (2 to the 8th possible values (8 bits) for each of 3 channels). And that transparency is an extra channel in a PNG file is new to me.
    Not bad for 10 minutes of reading.
    You mention Hue Saturation Brightness as another way to represent color. I’d like to hear more about this.

  11. Roi

    So…….what’s HSB and LAB?

Enter Your Email Here to Get Access for Free:

Go check your email!