PHP Convert RGB from/to HTML hex color

abstract

This article provides two functions for converting HTML color (like #AAED43) to three RGB values ($r = 170, $g = 237, $b = 67) and converting RGB values to HTML color.

compatible

PHP 3, 4
PHP 5

First function, html2rgb recognizes HTML or CSS colors in format #(hex_red)(hex_green)(hex_blue), where hex_red, hex_green and hex_blue are 1 or 2-digit hex-representations of red, green or blue color components.

# character in the beginning can be omitted. Function returns array of three integers in range (0..255) or false when it fails to recognize color format.

<?php
function html2rgb($color)
{
    if ($color[0] == '#')
        $color = substr($color, 1);

    if (strlen($color) == 6)
        list($r, $g, $b) = array($color[0].$color[1],
                                 $color[2].$color[3],
                                 $color[4].$color[5]);
    elseif (strlen($color) == 3)
        list($r, $g, $b) = array($color[0].$color[0], $color[1].$color[1], $color[2].$color[2]);
    else
        return false;

    $r = hexdec($r); $g = hexdec($g); $b = hexdec($b);

    return array($r, $g, $b);
}
?>

Second function, rgb2html converts its arguments (r, g, b) to hexadecimal html-color string #RRGGBB Arguments are converted to integers and trimmed to 0..255 range. It is possible to call it with array argument rgb2html($array_of_three_ints) or specifying each component value separetly rgb2html($r, $g, $b).

<?php
function rgb2html($r, $g=-1, $b=-1)
{
    if (is_array($r) && sizeof($r) == 3)
        list($r, $g, $b) = $r;

    $r = intval($r); $g = intval($g);
    $b = intval($b);

    $r = dechex($r<0?0:($r>255?255:$r));
    $g = dechex($g<0?0:($g>255?255:$g));
    $b = dechex($b<0?0:($b>255?255:$b));

    $color = (strlen($r) < 2?'0':'').$r;
    $color .= (strlen($g) < 2?'0':'').$g;
    $color .= (strlen($b) < 2?'0':'').$b;
    return '#'.$color;
}
?>

Here is an example php-application which uses both of the functions: HTML Gradient Builder. It takes two HTML-color values and draws 21 gradient-strips using HTML/CSS <div style="background-color... > code.

<?php 
// paste rgb2html and html2rgb functions here 
?>
<html><head><title>HTML Gradient Builder </title></head><body>
<table><tr><td>
<form action="<?php echo $PHP_SELF?>">
<label for="source_color">Source color</label><br>
<input type="text" name="source_color" id="source_color" value="<?php
if (isset($_GET['source_color']))
    echo $_GET['source_color'];
else
    echo 'F0F';
?>">
<br>
<label for="dest_color">Destination color</label><br>
<input type="text" name="dest_color" id="dest_color" value="<?php
if (isset($_GET['dest_color']))
    echo $_GET['dest_color'];
else
    echo '0F0';
?>">
<br><br>
<input type="submit" value="draw gradient">
</form>
</td><td>
Try colors:
<ul>
<li>#000 - white</li>
<li>#00F - blue</li>
<li>#0F0 - green</li>
<li>#F00 - red</li>
</ul>
</td>
<td>
<ul><li>F0F - magenta</li>
<li>0FF - cyan</li>
<li>FF0 - yellow</li>
</ul>
</tr></table>
<?php
// if there source_color and dest_color parameters have passed to the script
if (isset($_GET['source_color']) && isset($_GET['dest_color']))
{
    echo "<h1>Result:</h1>";
    $src_color = html2rgb($_GET['source_color']);
    $dst_color = html2rgb($_GET['dest_color']);
    print_r($dst_color);
    
    for($i=0; $i<3; $i++)
        $step_color[$i] = ( $dst_color[$i] - $src_color[$i] ) / 20.0;
    // step_color array contains difference between adjacent color stripes
    
    $html_out = ''; // html code container
    
    for($j=0; $j<21; $j++)
    {
    // generate color stripe code
        $line = '<div style="background-color: '.rgb2html($src_color).';">&nbsp;</div>';
        $html_out .= "{$line}\n"; // save color stripe to display HTML code later
        echo $line; // output color stripe to browser

        for($i=0; $i<3; $i++) // incrementing each color component
            $src_color[$i] += $step_color[$i];
    }
}
?>
<h1>HTML Code:</h1>
<pre><?php
// output HTML code replacing < and > with &lt; and &gt;
echo strtr($html_out, array('&' => '&amp;',
                            '<' => '&lt;',
                            '>'=> '&gt;'));
?></pre>
</body></html>

warning

Function html2rgb simply skips every non-hex symbol in the input string. It may return zero values for non-hex color components.

tested by AnyExample.com on 2006-10-24

FreeBSD 5.2 :: PHP 5.1.6
Linux :: PHP 4.4.4

License | Privacy | Contact