Let's say I have the color rgba(255, 0, 0, 0.5) on a white background. The color that can bee seen is almost identical to rgba(255, 140, 140, 1) which is a solid color. I'm looking for an algorithm that converts a semi-transparent color (over white) to a solid color so that it looks (pretty much) the same when it's one near each other (like in the photo below)
I noticed that if there are 2 ponents (r, g, or b) that are 0, then you have to keep the not-null ponent's value and adjust the null ponents by the same value so that it matches the wight color. This value (I guess) depends on the alpha ponent of semi-transparent color. But I can't seem to find the formula. How about the rest of the case? I think there must be a general formula that can be applied.
I'm looking for an answer in pseudocode, javascript, Java, Python, C# or C++.
Also, I am not working on any project. This question is for learning purposes and for helping people that might need this.
Let's say I have the color rgba(255, 0, 0, 0.5) on a white background. The color that can bee seen is almost identical to rgba(255, 140, 140, 1) which is a solid color. I'm looking for an algorithm that converts a semi-transparent color (over white) to a solid color so that it looks (pretty much) the same when it's one near each other (like in the photo below)
I noticed that if there are 2 ponents (r, g, or b) that are 0, then you have to keep the not-null ponent's value and adjust the null ponents by the same value so that it matches the wight color. This value (I guess) depends on the alpha ponent of semi-transparent color. But I can't seem to find the formula. How about the rest of the case? I think there must be a general formula that can be applied.
I'm looking for an answer in pseudocode, javascript, Java, Python, C# or C++.
Also, I am not working on any project. This question is for learning purposes and for helping people that might need this.
Share Improve this question edited Jan 21, 2018 at 7:03 Stefan Octavian asked Jan 20, 2018 at 18:17 Stefan OctavianStefan Octavian 6208 silver badges19 bronze badges1 Answer
Reset to default 15I know this formula to convert from rgba to rgb
function rgba2rgb(background, color) {
const alpha = color[3]
return [Math.floor((1 - alpha) * background[0] + alpha * color[0] + 0.5),
Math.floor((1 - alpha) * background[1] + alpha * color[1] + 0.5),
Math.floor((1 - alpha) * background[2] + alpha * color[2] + 0.5)]
}
console.log(rgba2rgb([255, 255, 255], [255, 0, 0, 0.5])) // [ 255, 128, 128 ]
But it's not right for your example