Glossary Index

RGB Color Model

An additive color model that represents colors by combining red, green, and blue light channels, used as the foundation of all digital screen color.

What is the RGB Color Model?

RGB is an additive color model that represents colors by specifying the intensity of three light channels: red (R), green (G), and blue (B). Each channel has a value from 0 (off) to 255 (fully on). Combining all three channels at full intensity produces white; combining them all at zero produces black. The model is called "additive" because colors are created by adding light together, unlike pigment mixing which is subtractive.

RGB is the native color model of digital displays. Every pixel on a screen is made up of red, green, and blue sub-pixels, and their relative intensities create the full range of colors you see.

Why is the RGB Color Model important?

RGB is the foundation of all digital color. It's the model that screens use to produce color, and it's what CSS, HEX, and most design tools operate in by default. Understanding RGB helps you understand why colors behave the way they do on screen, and why transferring colors between display and print requires color space conversion.

RGB is also the basis of HEX color codes, which are simply RGB values expressed in hexadecimal notation. Every #RRGGBB value is a direct encoding of the three channel values.

How to use RGB in CSS

Syntax: rgb(R G B) or rgb(R G B / alpha)

Values can be:

With alpha (transparency): rgb(59 130 246 / 0.5), 50% transparent blue

The legacy comma syntax rgb(59, 130, 246) is equivalent but the modern space syntax is preferred.

Examples

Best practices

FAQs

RGB is a general model describing how colors are produced by mixing red, green, and blue light. sRGB (standard RGB) is a specific, standardized color space that defines exactly which red, green, and blue primaries are used and how the model maps to physical light. Most screens, CSS colors, HEX values, and web images use sRGB. When someone says 'RGB color' in web design, they almost always mean sRGB.

In RGB, lightness is distributed non-linearly across hues. You can't simply adjust one channel to make a color lighter while maintaining its hue. Creating a lighter version of a color usually requires adjusting all three channels in specific proportions, which isn't intuitive. This is why HSL or OKLCH are preferred for palette work. They separate lightness into its own adjustable channel.

Additive color (RGB) works by mixing light. Combining all primaries at full intensity produces white, which is how screens work. Subtractive color (CMYK) works by mixing pigments that absorb light. Combining all primaries produces black (or near-black), which is how print works. Converting between the two requires color space transformations and generally involves some loss of fidelity, since the two models have different color gamuts.