1. Basic Principles of RGB Color Mode
RGB color mode is the core color system for electronic display devices such as monitors and televisions. Essentially, it presents all screen colors perceivable by human vision through different proportional combinations of red (Red), green (Green), and blue (Blue) colored light.
1.1 Underlying Logic of Light Mixing
- Using a magnifying glass to observe a computer or television screen, you can see densely distributed red, green, and blue dots (minimum display units). All screen images are composed of these three colored lights.
- These three colored lights are called "primary colors of light," analogous to sugar, salt, and monosodium glutamate in Chinese cuisine: different dishes achieve different flavors by adjusting the proportions of these three seasonings, while different images present different colors by adjusting the proportions of RGB colored light.
1.2 Brightness Levels and Total Colors in RGB
1.2.1 Numerical Expression of Brightness
The brightness of RGB colored lights is expressed as integers from 0-255, totaling 256 levels (Note: 0 means "no light emission," 255 means "maximum brightness," similar to the "off" to "maximum brightness" settings of a dimmable desk lamp).
1.2.2 Calculation of Total Colors
The total number of colors that can be combined from RGB colored lights with 256 brightness levels is:
256 (red) × 256 (green) × 256 (blue) = 16,777,216 colors
This number is commonly abbreviated as "16 million colors" or "tens of millions of colors," also known as "24-bit color" (because 2^24 = 16,777,216).
1.2.3 Meaning of "8-bit Channel Color"
- The "channel" here refers to the brightness range of a single colored light (i.e., 0-255). Since 256 = 2^8, each colored light's channel is called an "8-bit channel," and the combination of RGB colored lights is "8-bit channel color."
- Computers use powers of 2 to express color quantities because the underlying computer operations are binary calculations, and powers of 2 facilitate data storage and processing.
1.2.4 Supplementary Explanation of 16-bit Channel Color
Starting from Photoshop CS version, the software supports "16-bit channel color" (i.e., 48-bit color):
- The brightness range for a single colored light is 0-65535 (2^16 = 65536 levels), and the combination of three colored lights can present approximately 281 trillion colors (65536×65536×65536).
- Note: The number of colors the human eye can distinguish does not reach the 16.78 million colors of 24-bit color, so the "more colors" of 16-bit channel color show no significant difference to human vision and are only occasionally used in professional image post-processing (such as high-precision photography retouching).
1.3 "Control" Attributes of Channels
RGB color channels are not "visible image elements" but "tools for controlling light brightness," analogous to the "dimming buttons" of three adjustable desk lamps:
- Viewers can only perceive the final image colors, not directly see the mixing process of RGB colored lights (similar to how audiences only focus on movie plots, not the director's filming commands).
- Note: The "color channels" here are not exactly the same concept as "image channels" in subsequent Photoshop tutorials and need to be understood separately.
2. Practical Steps for RGB Color Mode in Photoshop
Through Photoshop, you can intuitively observe and adjust RGB colors. The following is the core operation process:
2.1 Three Methods to Open Images
- Menu operation: Click [File] → [Open] in the top menu bar and select the target image file.
- Shortcut key: Press
CTRL+O(Windows system) directly to quickly bring up the "Open" dialog box. - Drag import: Directly drag the image file from a Windows folder to the Photoshop window; if the PS window is covered, you can drag it to the PS icon on the taskbar, and then move it in after the window pops up.
2.2 Observing RGB Values with the "Info Panel"
- Bring up the panel: Press the shortcut key
F8, or open the "Info Panel" through the menu [Window] → [Info]. - Observe values: Move the mouse in the image, and the R, G, B values in the panel will change in real-time ——
- Mouse over blue areas: B (blue) value is high;
- Mouse over red areas: R (red) value is high.
2.3 Adjusting RGB Colors with the "Color Panel"
- Bring up the panel: Press the shortcut key
F6to open the "Color Panel." - Switch to RGB mode: If the panel defaults to non-RGB display, click the small triangle in the upper right corner of the panel and select [RGB Sliders] in the pop-up menu.
- Foreground and background colors:
- The left color block in the panel is the "foreground color," and the right is the "background color";
- Photoshop's default foreground color is black and background color is white. Press the shortcut key
Dto quickly restore default colors.
3. Correspondence Between RGB Values and Common Colors
Colors can be precisely defined through RGB values. The following are the values and principles of 6 basic colors:
| Color | RGB Values | Principle Explanation |
|---|---|---|
| Pure Black | 0, 0, 0 | All three colored lights do not emit light (brightness is 0) |
| Pure White | 255, 255, 255 | All three colored lights reach maximum brightness (255) |
| Pure Red | 255, 0, 0 | Only red light emits light (maximum brightness), green and blue lights do not emit light |
| Pure Green | 0, 255, 0 | Only green light emits light (maximum brightness), red and blue lights do not emit light |
| Pure Blue | 0, 0, 255 | Only blue light emits light (maximum brightness), red and green lights do not emit light |
| Pure Yellow | 255, 255, 0 | Red light + Green light (both maximum brightness), blue light does not emit light |
3.1 Key Question: Why Is There No "Yellow" Option in RGB?
RGB is a "colored light mixing system." Yellow is not a basic colored light but is achieved by "subtracting blue":
- From the "hue spectrum" (red→orange→yellow→green→cyan→blue→purple, connecting head to tail to form a ring), we know: yellow and blue are "complementary colors," approaching yellow means moving away from blue.
- Principle formula: Yellow = White - Blue (white is RGB full brightness; after subtracting blue light, the remaining red + green mix to form yellow), so the RGB value for pure yellow is 255,255,0.
3.2 Determining Color Cast (Screen Display Scenario)
If a screen image appears yellowish, it's not because "there's too much yellow light," but because "there's too little blue light" — the B (blue) value needs to be increased for correction; similarly, if it appears reddish, increase G/B values, and if it appears bluish, increase R/G values.
4. Complementary Colors (Inverted Colors) of RGB
4.1 Definition of Complementary Colors
In the hue spectrum ring diagram, two colors at a 180-degree angle (i.e., colors at opposite ends of the ring diameter) are called "complementary colors" (inverted colors), showing a "zero-sum" relationship (like a seesaw, you can't approach both complementary colors simultaneously).
4.2 Complementary Color Correspondence of Primary Colors
- Red ↔ Cyan
- Green ↔ Magenta
- Blue ↔ Yellow
4.3 Calculation Method for Complementary Colors
The complementary color of any color can be calculated by "255 minus the original RGB values": Example: The RGB value for yellow is 255,255,0, and its complementary color is calculated as ——
- R: 255 - 255 = 0
- G: 255 - 255 = 0
- B: 255 - 0 = 255 Result is 0,0,255, which is "pure blue," consistent with the conclusion that "blue is the complementary color of yellow" in the hue spectrum.
5. Advantages of RGB Color Mode
RGB mode is the physical color mode of displays, which means:
- Regardless of using CMYK, Lab, or other color modes in software, when displayed on screen, they all need to be converted to RGB mode;
- Directly using RGB mode to operate in Photoshop means the computer doesn't need additional color conversion processing, theoretically more efficient (although the speed difference is not obvious in daily use, it can save computing power in professional retouching).