Sign Up to our social questions and Answers Engine to ask questions, answer people’s questions, and connect with other people.
Login to our social questions & Answers Engine to ask questions answer people’s questions & connect with other people.
Lost your password? Please enter your email address. You will receive a link and will create a new password via email.
Please briefly explain why you feel this question should be reported.
Please briefly explain why you feel this answer should be reported.
Please briefly explain why you feel this user should be reported.
I have a png image where some pixels are transparent. The image is all white. How do I use css or javascript to blend the color to another color given its hex code?
I’m looking for something like (this is just pseudocode)
<img src="test.png" style="color-blend:#ffea6e;"/>
So the effect of this is, the image’s (since it was white) new color will be exactly the given color. The pixels that are transparent shouldn’t be affected (i.e. remain transparent).
Using CSS gradients you could achieve this effect. Just be sure that the blend part has the correct “stops” setting.
A great generator of CCS graidents: http://www.colorzilla.com/gradient-editor/
You can see there are preset gradients that already include transparency to get you started.
The <canvas> element seems like overkill for what you’re trying to accomplish and is HTML5 markup, only supported by IE9+ (and pretty much all other browsers ; ).