Understanding the RGB Color Model

Computer Monitors Display RGB, So It's Used for Web-Based Projects

RGB Color
RGB Color.

There are many models that graphic designers use to accurately measure and describe color. RGB is among the most important because it is what our computer monitors use to display text and images. It is vital that graphic designers understand the difference between RGB and CMYK as well as the working spaces such as sRGB and Adobe RGB. These will determine how the viewer sees your finished projects.

What is the RGB Color Model?

The RGB color model is based on the theory that all visible colors can be created using the primary additive colors of red, green, and blue. These colors are known as 'primary additives' because when they are combined in equal amounts they produce white. When two or three of them are combined in different amounts, other colors are produced.

For example, combining red and green in equal amounts creates yellow, green and blue creates cyan, and red and blue creates magenta. These particular formulae create the CMYK colors used in printing.

As you change the amount of red, green and blue you are presented with new colors. The combinations provide an endless array of colors.

Additionally, when one of these primary additive colors is not present, you get black.

RGB Color in Graphic Design

The RGB model is important to graphic design because it is used in computer monitors.

The screen you are reading this very article on is using additive colors to display images and text. That is why your monitor allows you to adjust only the red, green, and blue colors and your monitor's color calibrator measures screens of these three colors as well.

Therefore, when designing websites and other on-screen projects such as presentations, the RGB model is used because the final product is viewed on a computer display.

If, however, you are designing for print, you will use the CMYK color model. When designing a project that will be viewed both on screen and in print, you will need to convert the print copy to CMYK. 

Tip: Due to all of these different types of files that designers must produce, it is crucial that you are organized and properly name your files for their desired purpose. Organize a project's files into separate folders for print and web use and add indicators such as '-CMYK' to the end of print-worthy file names. This will make your job much easier when you need to find a specific file for your client.

Types of RGB Color Working Spaces

Within the RGB model are different color spaces known as 'working spaces.' The two most commonly used are sRGB and Adobe RGB. When working in a graphics software program such as Adobe Photoshop or Illustrator, you can choose which setting to work in.

  • sRGB: The sRGB space is best used when designing for the web, as it is what most computer monitors use.
  • Adobe RGB: The Adobe RGB space contains a larger selection of colors that are not available in the sRGB space, so it is best to use when designing for print. It is also recommended for use with photos taken with professional digital cameras (as opposed to consumer-level) because high-end cameras often use the Adobe RGB space.

    You may run into a problem with Adobe RGB images once they appear on a website. The image will look amazing in your software but may appear dull and lack the vibrant colors on a web page. Quite often, it affects the warmer colors such as the oranges and reds the most. To fix this issue, simply convert the image to sRGB in Photoshop and save a copy that is designated for web use.