Flash
ActionScript

Author
2014

0

5
color gurus : calculate hex tints (add white)

Last reply Oct 24 2007, 05:57 PM

by alexboyer

Posted: Oct 24 2007, 02:53 PM

by slyone

I posted this on Actionscript.org but I think one of you awesome gurus here might know the answer to this.

First off just to clarify how I am using the word “tint”: a tint of a color in the print world is that same color with white added. For example, say I have 3 clips, each various tints of red…here are the corresponding hex values:

100% tint of Red : #FF0000
50% tint of Red: #FF8080
10% tint of Red: #FFE5E5

I need a way to calculate tints of a given hex value… ie I want to solve the following:

50% white + [#hex value] = [new #hex value]

I have looked at bitwise operators because I think the answer lies there but I have to admit binary numbers and converting between bases was never my strong suit. Any help appreciated.

thanks!

5 REPLIES

senocular

Should be able to find something in here:
http://proto.layer51.com/l.aspx?p=10

24 October 2007 03:03 PM

Author

slyone

Thanks senocular, for the quick reply.

I am not seeing anything in there that will help exactly. If you read my post, I am trying to calculate a new hex value based on adding white to a known hex value. That’s different from ‘tints’ in Flash (which transparently overlay a color over another color).

I just need help with the calculation part.
I need a function that will return a result for the following:

[percent of white] + [#hex value] = [new #hex value]

For the example I gave before (tints of red), the pseudo formula would look like:

50% white + #FF0000 = #FF8080

The question is, how do I make that calculation in Actionscript?

24 October 2007 03:43 PM

Nutrox

[as]var tintedA:Number = tintColour( 0xFF0000, 1.0 );
var tintedB:Number = tintColour( 0xFF0000, 0.5 );
var tintedC:Number = tintColour( 0xFF0000, 0.1 );

trace( tintedA.toString( 16 ) ); // ff0000
trace( tintedB.toString( 16 ) ); // ff8080
trace( tintedC.toString( 16 ) ); // ffe6e6

function tintColour( colour:Number, tint:Number ):Number
{
var r:Number = ( colour & 0xFF0000 ) >> 16;
var g:Number = ( colour & 0x00FF00 ) >> 8;
var b:Number = ( colour & 0x0000FF );

tint = 1 - tint;

r = Math.round( r + ( ( 255 - r ) * tint ) );
g = Math.round( g + ( ( 255 - g ) * tint ) );
b = Math.round( b + ( ( 255 - b ) * tint ) );

return ( r << 16 ) | ( g << 8 ) | b;
}[/as]
That seems to be working.

The tint value you pass to the function is a value between 0.0 and 1.0 inclusive, where 0.0 = 0% and 1.0 = 100%