3

I found a RGB to hex converter and I'm trying to make a RGBA to hex converter. The original rgb2hex function works but the new rgba2hex function does not. What am I doing wrong? The rgba function is returning gba, no r.

// convert RGB color data to hex
function rgb2hex(r, g, b) {
    if (r > 255 || g > 255 || b > 255)
        throw "Invalid color component";
    return ((r << 16) | (g << 8) | b).toString(16);
}

// convert RGBA color data to hex
function rgba2hex(r, g, b, a) {
    if (r > 255 || g > 255 || b > 255 || a > 255)
        throw "Invalid color component";
    return ((r << 32) | (g << 16) | (b << 8) | a).toString(16);
}

Example:

alert(rgb2hex(255, 155, 055));
alert(rgba2hex(255, 155, 055, 255));

Current output: ff9b2d and 9b2dff

Expected output:ff9b2d and ff9b2dff

2 Answers 2

8

Your issue is that bitwise math in JavaScript caps out at 31 bits, so you can't quite do this as is. You need to use normal math ops, not bitwise ops:

// convert RGBA color data to hex
function rgba2hex(r, g, b, a) {
    if (r > 255 || g > 255 || b > 255 || a > 255)
        throw "Invalid color component";
    return (256 + r).toString(16).substr(1) +((1 << 24) + (g << 16) | (b << 8) | a).toString(16).substr(1);
}

Also fixed an issue with the original algorithm where if the first component is < 10, the output doesn't have enough digits.

Anyway, this won't work anyway... #ff9b2dff isn't a valid color, but you may not care?

0
0

RGB to HEX

 rgb(0 255 94)
 rgb(0, 255, 94)

RGBA to HEX

 rgba(255,25,2,0.5)
 rgba(255 25 2 / 0.5)
 rgba(50%,30%,10%,0.5)
 rgba(50%,30%,10%,50%)
 rgba(50% 30% 10% / 0.5)
 rgba(50% 30% 10% / 50%)

DEMO - CODEPEN.IO

Your Answer

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

Not the answer you're looking for? Browse other questions tagged or ask your own question.