HSV to RGB color conversion

HSV to RGB Converter

Convert HSV color values to RGB and HEX

HSV Values

Hue (0-360°):

Saturation (0-100%):

Value (0-100%):

Conversion Results

HEX:

#FF0000

RGB:

rgb(255, 0, 0)

Red:

255

Green:

0

Blue:

0

Red: 255

Green: 0

Blue: 0

An HSV to RGB color converter is a tool or algorithm that transforms colors from the HSV (Hue, Saturation, Value) color model to the RGB (Red, Green, Blue) model. This conversion is widely used in digital graphics, image processing, and computer vision because HSV provides a more intuitive way to manipulate colors compared to RGB.

HSV Color Model

The HSV model represents colors based on three components:

Hue (H) – The color type (0° to 360°)

0° = Red, 120° = Green, 240° = Blue

Saturation (S) – The intensity of the color (0% to 100%)

0% = Grayscale, 100% = Fully saturated

Value (V) – The brightness of the color (0% to 100%)

0% = Black, 100% = Maximum brightness

RGB Color Model

The RGB model defines colors using three components:

• Red (R) – Intensity (0 to 255)

• Green (G) – Intensity (0 to 255)

• Blue (B) – Intensity (0 to 255)

HSV to RGB Conversion Algorithm

Step 1: Normalize HSV Values

• Hue (H) → Convert from degrees to a fraction (0 to 1) by dividing by 360.

• Saturation (S) → Convert from percentage to a fraction (0 to 1).

• Value (V) → Convert from percentage to a fraction (0 to 1).

Step 2: Calculate Chroma (C)

Chroma determines the color intensity relative to brightness.

$$C=V\times S$$

Step 3: Find Hue Sector

The hue is divided into six 60° sectors (0–5):

$$H^{\mathrm{\prime }}=H\times 6$$$$X=C\times (1-\mathrm{\mid }(H^{\mathrm{\prime }}\mathrm{m}\mathrm{o}\mathrm{d}2)-1\mathrm{\mid })$$

Step 4: Determine RGB Intermediate Values

Based on the hue sector, compute temporary RGB values:

Hue Sector (H')	RGB Intermediate Values
0 ≤ H' < 1	(C, X, 0)
1 ≤ H' < 2	(X, C, 0)
2 ≤ H' < 3	(0, C, X)
3 ≤ H' < 4	(0, X, C)
4 ≤ H' < 5	(X, 0, C)
5 ≤ H' < 6	(C, 0, X)

Step 5: Adjust for Brightness (Value, V)

Compute the difference between Value (V) and Chroma (C):

$$m=V-C$$

Add this to each RGB component:

$$(R,G,B)=(R_{temp}+m,G_{temp}+m,B_{temp}+m)$$

Step 6: Scale to 8-bit RGB (0–255)

Multiply each component by 255 and round to the nearest integer:

$$R_{final}=\text{round}(R\times 255)$$$$G_{final}=\text{round}(G\times 255)$$$$B_{final}=\text{round}(B\times 255)$$

---

Example Conversion

Convert HSV(300°, 100%, 100%) to RGB:

1. Normalize:

   • H = 300 / 360 = 0.833

   • S = 1.0

   • V = 1.0

2. Chroma (C):

   $$C=1.0\times 1.0=1.0$$

3. Hue Sector:

   $$H^{\mathrm{\prime }}=0.833\times 6=5.0$$

   (Falls in sector 5)

4. Intermediate RGB:

   $$(C,0,X)=(1.0,0,1.0\times (1-\mathrm{\mid }(5.0\mathrm{m}\mathrm{o}\mathrm{d}2)-1\mathrm{\mid }))=(1.0,0,1.0)$$

5. Adjust for Value:

   $$m=1.0-1.0=0$$$$(R,G,B)=(1.0+0,0+0,1.0+0)=(1.0,0,1.0)$$

6. Final RGB (0–255):

   $$(255,0,255)$$

   (This is Magenta in RGB.)

7.