Wipped

Thanks for the reactions guys. I'm still not exactly where i want to be but you brought me quite a bit closer. Will update when i reach the ultimate solution.

@IRON67 Thanks for the response. The problem is that i need a stand-alone overlay image, which will be rendered over the color in a html canvas with javascript

Hi y'all, Im a building a product configurator so that people can compose their own chair. What i do is: - I take the a photo of the product - Then i put a color (chosen by the user) over the places it should be colored (see the red image): Now i want to add the lighting effects of the original photo over this one. So what i want to do is take the following image: Now i want to make a transparant image to put over the color (red image) so that it looks realistic What i thought i wanted to do is: - Take the average color of the image - Make everything thats brighter then the average color a white spot which is transparent based on the difference between the light spot and the average color - Then do the same with dark spots but then with the color black Can someone help me do this? Or do you know a different way to achieve a realistic end picture? Thanks, Wipped