How can I change color of icon image using CSS?
css, html, jquery
Solution
Use an SVG icon, this one comes from Iconic. Icon melon is also good
Otherwise you could use a font-icon, this one comes from FontAwesome
If you must, you can use a CSS Filter but it is only supported in newer browsers. The best fallback would be to use SVG filter to do the same thing and use a data URL to apply it. Demo
-webkit-filter: invert(100%);
You could also use a sprite like agconti suggested
Problem
I am trying to figure out how to change the color of an image that is half transparent and half solid color. I want to be able to change the color of the white so I can add a hover, and add the ability to have a dynamic way to change the colors in wordpress. Using photoshop to fill the image isn't an option because I am going to build a color changer in to my Wordpress theme. I used a jQuery script called JFlat.js, because it seemed like EXACTLY what I needed. Although it doesn't seem to work at all for me. Following the exact steps I am guessing it is because it uses an old version of jQuery. Can anyone offer me some assistance? Here is a black version on the image, you can't see the white one so I will post this one for a better of idea of what I am talking about.