RBA Cash Rate: 4.35% · 1AUD = 0.67 USD · Inflation: 4.1%  
Leading Digital Marketing Experts | 1300 235 433 | Aggregation Enquires Welcome | Book Appointment
Example Interest Rates: Home Loan Variable: 5.20% (5.24%*) • Home Loan Fixed: 5.48% (6.24%*) • Fixed: 5.48% (6.24%*) • Variable: 5.20% (5.24%*) • Investment IO: 5.63% (6.88%*) • Investment PI: 5.49% (6.32%*)

Convert RGB Colour Values to HSV and HSL with PHP

Convert RGB Colour Values to HSV and HSL with PHP

The RGB model of visualising color can be problematic on the web because of the nature in which the values are mixed. Not unlike mixing paints from individual tins, we would have to alter all the quantity of all paints to achieve our desired result. For example, if we have an orange with RGB values of R217 G118 B33 and want to reduce its colourfulness by half to a less saturated orange, we would need to drag RGB sliders to decrease R by 31, increase G by 24, and increase B by 59; not a very effective model when using color pickers on the web.

Convert RGB Colour Values to HSV and HSL with PHP

The HSV model was developed in the mid-1970s based upon how colors are organized and conceptualized in human vision in terms of other color-making attributes, such as hue, lightness, and chroma. The model is based on the real-life mixing of black or white pigments to achieve lighter, darker, or less colorful colors. Mixing these pure colors with white produces tints (while reducing saturation) while mixing them with black producing shades. The model permits a single slider to alter color with another for saturation, and one for value (color scale). Most web-based color pickers are based off the model because a flat pallet will permit a user to simply drag their cursor over the screen. They're not perfect: both HSV and HSI trade off perceptual relevance for computation speed.

Convert RGB Colour Values to HSV and HSL with PHP

The screenshot below shows the orange color noted above in Color Cop .

Convert RGB Colour Values to HSV and HSL with PHP

This article will provide you with the PHP code to convert between RGB and HSV/HSL and back again.

RGB to HSV

1
<?php 
2
/*
3
 Convert RGB to HSV
4
 Convert RGB Colour Values to HSV and HSL with PHP
5
 http://www.beliefmedia.com/convert-rgb-hsv-hsl-php
6
*/
7
 
8
function beliefmedia_rgb_to_hsv($r, $g, $b) {
9
 
10
    $r = ($r / 255);
11
    $g = ($g / 255);
12
    $b = ($b / 255);
13
 
14
    $maxrgb = max($r, $g, $b);
15
    $minrgb = min($r, $g, $b);
16
    $chroma = $maxrgb - $minrgb;
17
 
18
    $computedv = 100 * $maxrgb;
19
 
20
    if ($chroma == 0)
21
      return array(0, 0, $computedv);
22
 
23
    $computeds = 100 * ($chroma / $maxrgb);
24
 
25
     switch ($minrgb) {
26
      case $r:
27
       $h = 3 - (($g - $b) / $chroma);
28
       break;
29
      case $b:
30
       $h = 1 - (($r - $g) / $chroma);
31
       break;
32
      default: /* $g == $minrgb */
33
       $h = 5 - (($b - $r) / $chroma);
34
       break;
35
     }
36
 
37
   $computedh = 60 * $h;
38
 return array('h'=>$computedh, 's'=>$computeds, 'v'=>$computedv);
39
}
40
 
41
/* Usage */
42
$r = '254'; $g = '106'; $b = '20';
43
echo '
44
<pre>' . print_r(beliefmedia_rgb_to_hsv($r, $g, $b), true) . '</pre>
45
 
46
';

HSV to RGB

1
<?php 
2
/*
3
 Convert HSV to RGB
4
 Convert RGB Colour Values to HSV and HSL with PHP
5
 http://www.beliefmedia.com/convert-rgb-hsv-hsl-php
6
*/
7
 
8
function beliefmedia_hsv_to_rgb($hue, $sat, $val, $array = false, $format = 'rgb(%d, %d, %d)') {
9
 
10
  if ($hue < 0)   $hue = 0;
11
  if ($hue > 360) $hue = 360;
12
  if ($sat < 0)   $sat = 0;
13
  if ($sat > 100) $sat = 100;
14
  if ($val < 0)   $val = 0;
15
  if ($val > 100) $val = 100;
16
 
17
  $dS = $sat/100.0;
18
  $dV = $val/100.0;
19
  $dC = $dV*$dS;
20
  $dH = $hue/60.0;
21
  $dT = $dH;
22
 
23
  while ($dT >= 2.0) $dT -= 2.0;
24
  $dX = $dC*(1-abs($dT-1));
25
 
26
    switch(floor($dH)) {
27
      case 0:
28
        $dR = $dC; $dG = $dX; $dB = 0.0; break;
29
      case 1:
30
        $dR = $dX; $dG = $dC; $dB = 0.0; break;
31
      case 2:
32
        $dR = 0.0; $dG = $dC; $dB = $dX; break;
33
      case 3:
34
        $dR = 0.0; $dG = $dX; $dB = $dC; break;
35
      case 4:
36
        $dR = $dX; $dG = 0.0; $dB = $dC; break;
37
      case 5:
38
        $dR = $dC; $dG = 0.0; $dB = $dX; break;
39
      default:
40
        $dR = 0.0; $dG = 0.0; $dB = 0.0; break;
41
    }
42
 
43
  $dM  = $dV - $dC;
44
  $dR += $dM; $dG += $dM; $dB += $dM;
45
  $dR *= 255; $dG *= 255; $dB *= 255;
46
  $rgb = ($array) ? array('r'=>round($dR), 'b'=>round($dG), 'g'=>round($dB)) : sprintf($format, round($dR), round($dG), round($dB));
47
 
48
 return $rgb;
49
}
50
 
51
/* Usage */
52
$h = '21.9574468085'; $s = '92.1568627451'; $v = '100';
53
// echo beliefmedia_hsv_to_rgb($h, $s, $v);
54
echo '
55
<pre>' . print_r(beliefmedia_hsv_to_rgb($h, $s, $v, $array = true), true) . '</pre>
56
 
57
';
58
?>

An array returns the RGB values with r, g and b as keys. You may optionally alter the string pattern that is returned by altering $format.

While the HSL model ("L" for lightness) is similar to HSV in terms of the conical or cylindrical model that it is based upon, the outward saturation (from the vertical middle axis) is very different. Wikipedia says it better than me: "Because HSL and HSV are simple transformations of device-dependent RGB models, the physical colors they define depend on the colors of the red, green, and blue primaries of the device or of the particular RGB space, and on the gamma correction used to represent the amounts of those primaries. Each unique RGB device therefore has unique HSL and HSV spaces to accompany it, and numerical HSL or HSV values describe a different color for each basis RGB space."

We're not sure of the original source of the HSI functions. They came to us years ago when a former partner in the business was developing web image software around 2007.

RGB to HSL

1
<?php 
2
/*
3
 Convert RGB to HSL
4
 Convert RGB Colour Values to HSV and HSL with PHP
5
 http://www.beliefmedia.com/convert-rgb-hsv-hsl-php
6
*/
7
 
8
function beliefmedia_rgb_to_hsl($r, $g, $b) {
9
 
10
  $oldR = $r;
11
  $oldG = $g;
12
  $oldB = $b;
13
 
14
  $r /= 255;
15
  $g /= 255;
16
  $b /= 255;
17
 
18
  $max = max( $r, $g, $b );
19
  $min = min( $r, $g, $b );
20
 
21
  $h; $s;
22
  $l = ( $max + $min ) / 2;
23
  $d = $max - $min;
24
 
25
    if( $d == 0 ) {
26
      $h = $s = 0;
27
 
28
      } else {
29
 
30
      $s = $d / ( 1 - abs( 2 * $l - 1 ) );
31
 
32
      switch( $max ) {
33
        case $r:
34
         $h = 60 * fmod( ( ( $g - $b ) / $d ), 6 );
35
          if ($b > $g) {
36
           $h += 360;
37
          }
38
         break;
39
 
40
        case $g:
41
         $h = 60 * ( ( $b - $r ) / $d + 2 );
42
         break;
43
 
44
        case $b:
45
         $h = 60 * ( ( $r - $g ) / $d + 4 );
46
         break;
47
        }
48
     }
49
  return array('h' => round($h, 2), 's' => round($s, 2), 'l' => round($l, 2));
50
}
51
 
52
/* Usage */
53
$r = '217'; $g = '118'; $b = '33';
54
// $array = beliefmedia_rgb_to_hsl($r, $g, $b);
55
echo '
56
<pre>' . print_r(beliefmedia_rgb_to_hsl($r, $g, $b), true) . '</pre>
57
 
58
';

HSL to RGB

1
<?php 
2
/*
3
 Convert HSL to RGB
4
 Convert RGB Colour Values to HSV and HSL with PHP
5
 http://www.internoetics.com/2016/04/13/php-convert-rgb-hsv-hsl/
6
*/
7
 
8
function beliefmedia_hsl_to_rgb($h, $s, $l, $array = false, $format = 'rgb(%d, %d, %d)') {
9
  $r; $g; $b;
10
 
11
  $c = (1 - abs(2 * $l - 1)) * $s;
12
  $x = $c * (1 - abs(fmod( ($h / 60), 2) - 1));
13
  $m = $l - ($c / 2);
14
 
15
  switch($h) {
16
    case ($h < 60):
17
      $r = $c; $g = $x; $b = 0;
18
      break;
19
    case ($h < 120):
20
      $r = $x; $g = $c; $b = 0;
21
      break;
22
    case ($h < 180):
23
      $r = 0; $g = $c; $b = $x;
24
      break;
25
    case ($h < 240):
26
      $r = 0; $g = $x; $b = $c;
27
      break;
28
    case ($h < 300):
29
      $r = $x; $g = 0; $b = $c;
30
      break;
31
    default:
32
      $r = $c; $g = 0; $b = $x;
33
      break;
34
  }
35
 
36
  $r = floor(($r + $m) * 255);
37
  $g = floor(($g + $m) * 255);
38
  $b = floor(($b + $m) * 255);
39
 
40
  $return = ($array) ? array('r' => $r, 'g' => $g, 'b' => $b) : sprintf($format, round($r), round($g), round($b));
41
 return $return;
42
}
43
 
44
/* Usage */
45
$h = '27.72'; $s = '0.74'; $l = '0.49';
46
// echo beliefmedia_hsl_to_rgb($h, $s, $l);
47
echo '
48
<pre>' . print_r(beliefmedia_hsl_to_rgb($h, $s, $l, $array = true), true) . '</pre>
49
 
50
';

The RGB value can be returned as an array or formatted string.

Considerations

All the examples on this page have omitted the pre tags for formatting purposes. The download includes working code.

See also this article: "Convert Colours Between their Hexadecimal and RGB Values with PHP". We have a number of color posts scheduled that'll work with data in various ways; they will all be available via the color Tag: color tag.

Download


Title: Convert RGB Colour Values to HSV and HSL
Description: Convert RGB Colour Values to HSV and HSL with PHP.
  Download • Version 0.2, 1.6K, zip, Category: PHP Code & Snippets

Download our 650-page guide on Finance Marketing. We'll show you exactly how we generate Billions in volume for our clients.

  AUS Eastern Standard Time (Virginia)

  Want to have a chat?
 

RELATED READING

Like this article?

Share on Facebook
Share on Twitter
Share on Linkdin
Share on Pinterest

Leave a comment