I was trying to see if there’s a way to change the color of some specific parts of an image without overriding the texture of it for example there’s a picture of a wooden table and I want to change the color of the top by a button without it losing the texture or affecting the other parts of the picture I tried using filters but that changed the entire picture, any help would be appreciated.
the example image:
one of the images is this and I want to change the color to red when clicked without changing the texture and making it all the same tone without any difference
2
Answers
I suggest experimenting with
globalCompositeOperation
A fast way would be manipulate pixels manually. So the steps:
ImageData
of the canvas withgetImageData()
.ImageData
with the same dimensions, let’s call ittransformed
.ImageData
to HSL, set ithue
to1
(red) and convert back to RGB and set this converted pixel to thetransformed
‘s datatransformed
on the canvas withputImageData()
: