Color Models

The conversion of colors from HSI (Hue, Saturation, Intensity) to RGB (Red, Green, Blue) is a fundamental process in image processing, where the goal is to translate colors defined by human-perceived characteristics into the RGB model, which is used in digital displays and cameras. The HSI model separates hue (the type of color), saturation (the vividness or purity of the color), and intensity (brightness), which allows for easier manipulation of these aspects, especially for tasks such as color correction or enhancement.

HSI to RGB Conversion Process

To convert HSI values (with H in the range [0°, 360°] and S and I in the range [0, 1]) to RGB, we use a set of equations. The conversion process depends on the value of H, as this determines the color sector in which the hue lies. There are three key sectors, each corresponding to a 120° interval of hue:

1. RG sector (0° ≤ H < 120°)
2. GB sector (120° ≤ H < 240°)
3. BR sector (240° ≤ H ≤ 360°)

RG Sector (0° ≤ H < 120°):

When H lies between 0° and 120°, we calculate the RGB components as follows:

• Blue component (B):

  $$B = I(1 – S)$$

  This equation indicates that the blue component is determined by the intensity (I) reduced by the saturation (S). A lower saturation means a higher value of blue.

• Red component (R):

  $$R = I \left[ 1 + \frac{S \cos(H)}{\cos(60° – H)} \right]$$

  This formula adjusts the red component based on the hue (H) and saturation (S). The cosine functions help manage the transitions between colors smoothly.

• Green component (G):

  $$G = 3I – (R + B)$$

  The green component is computed by subtracting the red and blue components from three times the intensity. This ensures that the total intensity remains consistent.

GB Sector (120° ≤ H < 240°):

When the hue falls between 120° and 240°, the calculation is similar but requires an initial adjustment to H by subtracting 120° to simplify the angle:

• Hue adjustment: $$H = H – 120°$$

After adjusting H, the RGB components are calculated:

• Red component (R):

  $$R = I(1 – S)$$

  As in the RG sector, the red component depends on the intensity reduced by the saturation.

• Green component (G):

  $$G = I \left[ 1 + \frac{S \cos(H)}{\cos(60° – H)} \right]$$

  The green component is modified based on the adjusted hue, saturation, and cosine functions, similar to the way red was calculated in the RG sector.

• Blue component (B):

  $$B = 3I – (R + G)$$

  The blue component is found by subtracting the sum of the red and green components from three times the intensity.

BR Sector (240° ≤ H ≤ 360°):

For hues between 240° and 360°, another adjustment is made to H, this time subtracting 240°:

• Hue adjustment: $$H = H – 240°$$

After this adjustment, the RGB components are computed as follows:

• Green component (G):

  $$G = I(1 – S)$$

  The green component is calculated similarly to the red in the previous sectors.

• Blue component (B):

  $$B = I \left[ 1 + \frac{S \cos(H)}{\cos(60° – H)} \right]$$

  This formula determines the blue component, based on the adjusted hue and saturation.

• Red component (R):

  $$R = 3I – (G + B)$$

  The red component is found by subtracting the sum of the green and blue components from three times the intensity.

In image processing, manipulating HSI (Hue, Saturation, Intensity) component images is a powerful method that allows us to make targeted adjustments to specific aspects of an image’s color characteristics. By working within the HSI color model, we can modify the hue (the actual color), the saturation (color purity or vividness), and the intensity (brightness) independently, which gives greater flexibility compared to the RGB color model where color and brightness are interdependent.

Overview of the HSI Color Model

The HSI model separates color into three components:

1. Hue (H): This defines the actual color, and is measured in degrees (from 0° to 360°) on the color wheel. For example, 0° represents red, 120° represents green, and 240° represents blue.
2. Saturation (S): This measures the purity of the color, with 0 representing gray (no color saturation), and 1 representing fully saturated colors.
3. Intensity (I): This represents the brightness of the color. It is the average of the RGB values and varies from 0 (black) to 1 (white).

Manipulating HSI Component Images

In this process, we modify the individual H, S, and I components, rather than the RGB values directly. This provides more intuitive control over how colors appear and how bright or dim they are. The manipulation of these components can result in significant changes in the resulting RGB image.

Example of HSI Manipulation

Let’s examine an example based on Figure 6.16, which demonstrates an RGB image and the corresponding HSI components:

1. Original RGB Image (Figure 6.16(a)):
   The image is composed of primary (red, green, blue) and secondary (cyan, magenta, yellow) colors, forming three overlapping circles. This is the original color image that we want to manipulate.

2. Hue Component (H) (Figure 6.16(b)):
   The hue image shows the angle corresponding to each color in the original RGB image. In grayscale, black represents areas where hue corresponds to red (0°), while white corresponds to hues closer to yellow, cyan, and green. This image maps the color information but disregards brightness and saturation.

3. Saturation Component (S) (Figure 6.16(c)):
   The saturation image shows how vivid the colors are in the original image. Dark regions correspond to areas with low saturation (closer to gray), and brighter regions represent more saturated colors (closer to their pure color). Areas with strong red, green, and blue appear brighter in this image.

4. Intensity Component (I) (Figure 6.16(d)):
   The intensity image represents the brightness of each pixel in the original image. White areas indicate high intensity (brightness), while black areas are regions of low intensity.

Mathematical Concepts in HSI Manipulation

To modify any aspect of the image, we adjust one or more of the HSI components and then convert the result back to the RGB color model using the following key equations:

1. Hue Modification:

To change the color in a specific region, we adjust the H value of the pixels corresponding to that region in the hue image.

For example, in Figure 6.17(a), the hue values of the blue and green regions (corresponding to the angles 120° and 240°) have been modified, making them black in the hue image. This change results in a transformation of those regions to a different hue when the image is converted back to RGB.

• Hue adjustment: $$H’ = \text{desired hue angle}$$ Where $H’$ is the new hue angle for the region we want to change. This angle determines the color it will map to in the RGB model.

2. Saturation Modification:

To change the saturation (or purity) of the color in a region, we modify the S value. For example, in Figure 6.17(b), the saturation of the cyan region (which is located between blue and green) has been reduced by half. As a result, that region appears more washed out (closer to gray).

The formula for adjusting saturation is simple:

Where $S’$ is the new saturation, and the scaling factor determines how much we decrease or increase the saturation. A value of 0 would turn the region gray, while a value of 1 keeps it at full saturation.

3. Intensity Modification:

To modify the brightness of the image, we adjust the I value. In Figure 6.17(c), the intensity in the central white region is reduced by half, making that region darker.

The formula for adjusting intensity is:

Where $I’$ is the new intensity. If we multiply by a value less than 1, the region becomes dimmer; multiplying by a value greater than 1 would brighten the region.

Reconstructing the RGB Image

After modifying the HSI components, we convert the image back to the RGB color model using the following equations for each color sector:

Conversion from HSI to RGB:

The conversion formulas depend on the hue sector, as described earlier:

• RG sector (0° ≤ H < 120°):

  $$B = I(1 – S)$$ $$R = I \left[ 1 + \frac{S \cos(H)}{\cos(60° – H)} \right]$$ $$G = 3I – (R + B)$$

• GB sector (120° ≤ H < 240°): First, adjust the hue:

  $$H = H – 120°$$

  Then, compute the RGB components:

  $$R = I(1 – S)$$ $$G = I \left[ 1 + \frac{S \cos(H)}{\cos(60° – H)} \right]$$ $$B = 3I – (R + G)$$

• BR sector (240° ≤ H ≤ 360°): Adjust the hue:

  $$H = H – 240°$$

  Then calculate:

  $$G = I(1 – S)$$ $$B = I \left[ 1 + \frac{S \cos(H)}{\cos(60° – H)} \right]$$ $$R = 3I – (G + B)$$

Final Example of HSI Manipulation

The result of converting the modified HSI image back to RGB is shown in Figure 6.17(d). In this case, we see the following changes:

• The cyan region’s saturation has been reduced, making it appear more gray.
• The intensity of the central white region has been reduced, dimming that area.
• The outer portions of the circles are now primarily red due to the hue adjustment in those regions.

These changes illustrate the power of the HSI model in allowing independent control over hue, saturation, and intensity—key aspects of image color. By using this method, we can make highly controlled adjustments to images for a variety of applications such as color correction, contrast enhancement, or aesthetic modifications.