Calculating increased/decreased brightness of a Hex value

[Pete]

So whilst I wasn't looking for this: http://processwire.com/talk/topic/3851-pirate-maps/ I finally found what I was looking for.

Essentially I needed to give a client the ability to use Soma's colour picker and tie the colour to an element on the page. Problem is the element's background has a gradient - disaster!

Not a problem any more, as it's possible to take a hex value and calculate lighter and darker colours: http://stackoverflow.com/questions/5199783/help-needed-with-php-function-brightness-making-rgb-colors-darker-brighter (see accepted answer halfway down).

The thing with web design/development is that pretty much anything is possible, and usually if you have an obscure requirement someone else will already have thought of a solution. Don't be limited by anything other than your imagination

[Pete]

Gah, spoke too soon. Works for increasing brightness but not decreasing

EDIT: there was a fix in the last comment below the "correct" answer - changing the last line to this works perfectly for increases and decreases in colour brightness:

return sprintf("#%02x%02x%02x", $r,$g,$b);

I'm using it so that someone can set the hover colour of jQuery UI accordions in association with some gradient styles from here: http://www.colorzilla.com/gradient-editor/

[Soma]

Maybe this is also interesting https://github.com/mexitek/phpColors

[Martijn Geerts]

Hey Pete,

I used these color functions in a project, as I needed also to use soma's Sliders for color outputs.

Maybe you can use one or more of them to.

// rgbToHsl
function rgbToHsl ( array $rgb ) {

	list( $r, $g, $b ) = $rgb;
	$r/= 255;
	$g/= 255;
	$b/= 255;
	$max = max( $r, $g, $b );
	$min = min( $r, $g, $b );
	$h;
	$s;
	$l = ( $max + $min )/ 2;

	if ( $max == $min ) {
		$h = $s = 0;
	} else {
		$d = $max - $min;
		$s = $l > 0.5 ? $d/ ( 2 - $max - $min ) : $d/ ( $max + $min );
		switch( $max ) {
			case $r:
			$h = ( $g - $b )/ $d + ( $g < $b ? 6 : 0 );
			break;
			case $g:
			$h = ( $b - $r )/ $d + 2;
			break;
			case $b:
			$h = ( $r - $g )/ $d + 4;
			break;
		}
		$h/= 6;
	}

	return array( $h, $s, $l );
}

// hslToRgb
function hslToRgb ( array $hsl ) {
	list( $h, $s, $l ) = $hsl;
	$r;
	$g;
	$b;
	if ( $s == 0 ) {
		$r = $g = $b = $l;
	}
	else {
		$q = $l < 0.5 ? $l * ( 1 + $s ) : $l + $s - $l * $s;
		$p = 2 * $l - $q;
		$r = hueToRgb( $p, $q, $h + 1/ 3 );
		$g = hueToRgb( $p, $q, $h );
		$b = hueToRgb( $p, $q, $h - 1/ 3 );
	}
	return array( round( $r * 255 ), round( $g * 255 ), round( $b * 255 ) );
}

// Convert percentages to points (0-255)
function normalizeCssRgb ( array $rgb ) {
	foreach ( $rgb as &$val ) {
		if ( strpos( $val, '%' ) !== false ) {
			$val = str_replace( '%', '', $val );
			$val = round( $val * 2.55 );
		}
	}
	return $rgb;
}

// cssHslToRgb
function cssHslToRgb ( array $hsl ) {

	// Normalize the hue degree value then convert to float
	$h = array_shift( $hsl );
	$h = $h % 360;
	if ( $h < 0 ) {
		$h = 360 + $h;
	}
	$h = $h/ 360;

	// Convert s and l to floats
	foreach ( $hsl as &$val ) {
		$val = str_replace( '%', '', $val );
		$val/= 100;
	}
	list( $s, $l ) = $hsl;

	$hsl = array( $h, $s, $l );
	$rgb = hslToRgb( $hsl );

	return $rgb;
}

// hueToRgb
function hueToRgb ( $p, $q, $t ) {
	if ( $t < 0 ) $t += 1;
	if ( $t > 1 ) $t -= 1;
	if ( $t < 1/6 ) return $p + ( $q - $p ) * 6 * $t;
	if ( $t < 1/2 ) return $q;
	if ( $t < 2/3 ) return $p + ( $q - $p ) * ( 2/ 3 - $t ) * 6;
	return $p;
}

// rgbToHex
function rgbToHex ( array $rgb ) {
	$hex_out = '#';
	foreach ( $rgb as $val ) {
		$hex_out .= str_pad( dechex( $val ), 2, '0', STR_PAD_LEFT );
	}
	return $hex_out;
}

// hexToRgb
function hexToRgb ( $hex ) {
	$hex = substr( $hex, 1 );

	// Handle shortened format
	if ( strlen( $hex ) === 3 ) {
		$long_hex = array();
		foreach ( str_split( $hex ) as $val ) {
			$long_hex[] = $val . $val;
		}
		$hex = $long_hex;
	}
	else {
		$hex = str_split( $hex, 2 );
	}
	return array_map( 'hexdec', $hex );
}

/**
 *
 * Output to a "r, g, b" string
 *
 */

function colorStringRGB($h, $s, $l ) {
	$output = '';
	$hsl = array($h, $s, $l);
	$color = cssHslToRgb($hsl);

	foreach( $color as $rgb ) $output .= $rgb . ', ';

	$output = rtrim( $output, ', ' );
	return $output;
}