Photoshop Question posted in
The official user guide can be found here.

Make a color changeable image for html? – Photoshop

So I’d like to know the best way to make a PNG image color-changeable.
I have it on Photoshop and it’s supposed to be on lots of different colors on my site, and I don’t want to go through the hassle of saving it in all of them.

Is there an easier way to do that? Like creating a font? Saving it as a format that html can change the color?

Thanks in advance

Tags:

2

Answers


  1. 0

    Convert your PNG to SVG (there are online converters available like this one http://image.online-convert.com/convert-to-svg) and then manage it’s color with a ‘stroke’ and ‘fill’ properties. It’s impossible to change color of a binary file (which a PNG file is) using CSS. If this option is not acceptable then make a sprite (https://css-tricks.com/css-sprites/).

    Login or Signup to reply.
  2. 0

    Check out the CSS filter property: https://developer.mozilla.org/en-US/docs/Web/CSS/filter

    I think the one you want is hue-rotate().

    And here it is for IE: https://msdn.microsoft.com/en-us/library/dn858632(v=vs.85).aspx

    Example:

    /* CSS */

img {
    -webkit-filter: hue-rotate(90deg);
    filter: hue-rotate(90deg);
}
    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search