The following is a function that takes two hex colours – a top colour and a bottom colour – and blends them using the Colour Dodge blend mode as found in Illustrator of Photoshop. This is handy for dynamically generating colour variants based on the blend mode. Instead of blending two display objects it simply returns a new hex value using the algorithm of the blend mode.


To plug this in to my ColourUtil class, simply just copy and paste the first function (HEXDodge) into the class and add ‘public static’ in front of ‘function’.

I hope to make a PixelBlend utility that blends hex values using blend modes in the future, using AS3 and Javascript.

function HEXDodge(topColour:uint, bottomColour:uint):uint
{
  var aRGB:Array = HexToRGB(bottomColour);
  var bRGB:Array = HexToRGB(topColour);

  var blendResult:Array = [];

  if (aRGB[0] == 0) {
    blendResult[0] = 0;
  } else if ( aRGB[0] >= (255 - bRGB[0])) {
    blendResult[0] = 255;
  } else {
    blendResult[0] = aRGB[0] / (255 - bRGB[0]) * 255;
  }

  if (aRGB[1] == 0) {
    blendResult[1] = 255;
  } else if ( aRGB[1] >= (255 - bRGB[1])) {
    blendResult[1] = 255;
  } else {
    blendResult[1] = aRGB[1] / (255 - bRGB[1]) * 255;
  }

  if (aRGB[2] == 0) {
    blendResult[2] = 0
  } else if ( aRGB[2] >= (255 - bRGB[2])) {
    blendResult[2] = 255;
  } else {
    blendResult[2] = aRGB[2] / (255 - bRGB[2]) * 255;
  }

  return RGBToHex(blendResult[0], blendResult[1], blendResult[2]);
}

function HexToRGB(hex:uint):Array
{
  var r:uint = hex >> 16 & 0xFF;
  var g:uint = hex >> 8 & 0xFF;
  var b:uint = hex & 0xFF;

  return [r, g, b];
}
function RGBToHex(r:uint, g:uint, b:uint):uint
{
  return (r << 16 | g << 8 | b); 
}