1

Does anyone know how to create two new colours (highlight and shadow) based on one colour in ActionScript 3? So, if I have red (0xFF0000), I will get a light red and dark red too?

I have no idea. Thanks!

1
  • In short, you need to convert the color to HSL, alter lightness/saturation, then convert back to RGB. All recipes are available via search. Commented Mar 17, 2022 at 11:53

1 Answer 1

0

To get Highlight (lightness) you increase each R, G and B equally by same amount (with maximum at 255 or 0xFF). In your case Red is already at its maximum so increase both Green and Blue by same amount (eg do a += 128 on each of those channels).

To get Shadow (darkness) you decrease each R, G and B equally by same amount (with minimum at 0 or 0x00). In your case both Green and Blue are already at their minimum so just decrease only Red by x amount (eg do a -= 128 on Red channel).

In short:
Input = 0xFF0000 ... then Highlight = 0xFF8080 and Shadow = 0x800000.

Update:
A good point was made in the comments about highlight/shadow cases of other colours (or hues). If we agree that "lighter" means adding more white and "darker" means adding more black then maybe a linear interpolation might help you (basically make a gradient of input colour fading to black or to white and choose your preferred darker/lighter colour along those A-to-B paths...

PS: By interpolating, you'll have the flexibility of blending to different hues and shades of lightness/darkness. Maybe blend from a bright red towards a darker reddish-purple (instead of just black) for "sweeter" shade colours, and your greens could have yellow highlights (instead of just white). Blue is up to you.

example usage:

var newColour :uint = 0;
newColour = blendRGB_AS3 (0xFF0000, 0xFFFFFF, 0.5) //# get 50% white added
newColour = blendRGB_AS3 (0xFF0000, 0x000000, 0.5) //# get 50% black added

Example function:
(note: (temp_int >> 0) is used here as a quick Math.Floor for any fractioned results)

//# function inputs: src_C, dest_C, stopPoint ... where:
//# src_C = source / start colour A (as 0xRGB)
//# dest_C = destination / end colour B (as 0xRGB)
//# stopPoint = A-to-B stopping point (as ranging from 0.0 to 1.0)

function blendRGB_AS3 (src_C, dest_C, stopPoint ) :uint
{
    //# using Unsigned INTegers since no need of the minus ( - ) sign.
    var temp_int :uint = 0; var res_C :uint = 0;
    
    var src_R :uint = (src_C >> 16 & 0xFF);
    var src_G :uint = (src_C >> 8 & 0xFF);
    var src_B :uint = (src_C >> 0 & 0xFF);
    
    var dst_R :uint = (dest_C >> 16 & 0xFF);
    var dst_G :uint = (dest_C >> 8 & 0xFF);
    var dst_B :uint = (dest_C >> 0 & 0xFF);
    
    //# Now for each R, G, B Channel... 
    //# calculate the mid-point value then merge that into output of "res_C"
    
    //# for Red
    temp_int = src_R + stopPoint * (dst_R - src_R);
    res_C = ( (temp_int >> 0) << 16);
    
    //# for Green
    temp_int = src_G + stopPoint * (dst_G - src_G);
    res_C |= ( (temp_int >> 0)  << 8);
    
    //# for Blue
    temp_int = src_B + stopPoint * (dst_B - src_B);
    res_C |= ( (temp_int >> 0)  << 0);
    
    return res_C; //# gives: example 0xFF0000 if red
    
}
Sign up to request clarification or add additional context in comments.

1 Comment

This works well with pure RGB but not with a mix. Let's say a 0xFF8000 is input, lighting would result in FFFF80 (light yellow) and shadow would provide a 0x800000 (dark red)

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.