# < Cron's Web Tech Blog

## 11 February 2011

### Actionscript/Javascript Colour mode conversion functions - convert HSB/HSL/HSV to RGB to web HEX color or to flash matrix

I wrote/found/tweaked these conversion functions today to convert between the most common colour modes. it was very difficult to find a solid source for converting colours online so I thought I'd post them here for the world. They should work in actionscript 2 & 3 and could easily be tweaked to work in php, python or any other language. Here goes...

Please see the right hand pane to say thanks!
``````
function hex2rgb(hex:uint):Array{
var rgb:Array = new Array();
rgb = hex >> 16;
rgb= hex >> 8 & 0xFF;
rgb = hex & 0xFF;
return rgb;
}

function rgb2hex (rgb:Array):uint{
var hex = rgb << 16 ^ rgb << 8 ^ rgb;
return hex;
}

function hsb2rgb(hsb:Array):Array {
var red, grn, blu, i, f, p, q, t;
hsb%=360;
if(hsb==0) {return(new Array(0,0,0));}
hsb/=100;
hsb/=100;
hsb/=60;
i = Math.floor(hsb);
f = hsb-i;
p = hsb*(1-hsb);
q = hsb*(1-(hsb*f));
t = hsb*(1-(hsb*(1-f)));
if (i==0) {red=hsb; grn=t; blu=p;}
else if (i==1) {red=q; grn=hsb; blu=p;}
else if (i==2) {red=p; grn=hsb; blu=t;}
else if (i==3) {red=p; grn=q; blu=hsb;}
else if (i==4) {red=t; grn=p; blu=hsb;}
else if (i==5) {red=hsb; grn=p; blu=q;}
red = Math.floor(red*255);
grn = Math.floor(grn*255);
blu = Math.floor(blu*255);
return (new Array(red,grn,blu));
}

function rgb2hsb(rgb:Array):Array {
var x, f, i, hue, sat, val;
rgb/=255;
rgb/=255;
rgb/=255;
x = Math.min(Math.min(rgb, rgb), rgb);
val = Math.max(Math.max(rgb, rgb), rgb);
if (x==val){
return(new Array(undefined,0,val*100));
}
f = (rgb == x) ? rgb-rgb : ((rgb == x) ? rgb-rgb : rgb-rgb);
i = (rgb == x) ? 3 : ((rgb == x) ? 5 : 1);
hue = Math.floor((i-f/(val-x))*60)%360;
sat = Math.floor(((val-x)/val)*100);
val = Math.floor(val*100);
return(new Array(hue,sat,val));
}

function hsb2hex(hsb:Array):uint{
var rgb=hsb2rgb(hsb);
return(rgb2hex(rgb));
}

function hex2hsb(hex:uint):Array{
var rgb=hex2rgb(hex);
return(rgb2hsb(rgb));
}

//flash only function: I dont have an inverse for this. maybe someone could post one in the comments?
function hex2matrix ( hex:uint, alpha:Number ){
var matrix:Array = [];
matrix = matrix.concat([((hex & 0x00FF0000) >>> 16)/255, 0, 0, 0, 0]);// red
matrix = matrix.concat([0, ((hex & 0x0000FF00) >>> 8)/255, 0, 0, 0]); //green
matrix = matrix.concat([0, 0, (hex & 0x000000FF)/255, 0, 0]); // blue
matrix = matrix.concat([0, 0, 0, alpha/100, 0]); // alpha
return matrix;
}

//USAGE:
trace('YELLOW HSB: 60,100,100 in hex mode is:'+hsb2hex([60,100,100])) //see note below *
trace('YELLOW HEX: FFFF00 in HSB mode is:'+hex2hsb(0xFFFF00))``````
I should note for beginners that most functions return an array of values. To access the individual hue/sat/brightness or red/green/blue values, use array syntax like so:
``````
hsb=hex2hsb(0xFFFF00);
hue=hsb;
sat=hsb;
val=hsb
``````
* I should also mention that flash converts hex values to numbers so hsb2hex([60,100,100]) will return 16776960 which is the same as 0xFFFF00 as far as flash is concerned.