How Does ImageTint Work?

[brijamelsh]

So I am thinking about using ImageTint, however I want to understand how it works before I commit to it.

So how does ImageTint actually work? Does it just replace the white values in an image with color? What if I have a gradient? Or alpha?

[jsmorley]

So I am thinking about using ImageTint, however I want to understand how it works before I commit to it.

So how does ImageTint actually work? Does it just replace the white values in an image with color? What if I have a gradient? Or alpha?

It adds the defined color to the colors already in the image. So it adds a "tint" of the color you specify to the existing colors. If you want to fully "colorize" the image instead, simply add GreyScale=1 on the meter as well. Then it will be desaturated first, and the ImageTint color will be applied.

Note: an ImageTint of 255,255,255 (white) in effect means "make no change". So ImageTint=255,255,255 can be used to restore the original colors of an image if you want to toggle the tint using !RainmeterSetVariable.

If you specify an alpha amount on the ImageTint statement, that alpha will be added to the image. If you have an image (.png) that already is partially transparent, this can be used to make it "more transparent". It cannot be used to make it "more opaque" however. The alpha value is added, not replaced, in the image. So an alpha of 255, much like with colors, means "make no change" and can be used to restore the original transparency of the image.

P.S. If you want finer control over the tinting / colorizing of an image meter, you might look at ColorMatrix: http://rainmeter.net/cms/Tips-ColorMatrixUnleased

[brijamelsh]

Thanks, that cleared it up nicely. I did look into ColorMatrix before deciding to try to use ImageTint but it was beyond me, at least for the time being anyways. I think it would have been overkill for what I am doing anyways.

[fabularasa]

How to add Gradient to ImageTint?

[smurfier]

How to add Gradient to ImageTint?

That is not currently possible.

[MerlinTheRed]

It adds the defined color to the colors already in the image. So it adds a "tint" of the color you specify to the existing colors. If you want to fully "colorize" the image instead, simply add GreyScale=1 on the meter as well. Then it will be desaturated first, and the ImageTint color will be applied.

Note: an ImageTint of 255,255,255 (white) in effect means "make no change". So ImageTint=255,255,255 can be used to restore the original colors of an image if you want to toggle the tint using !RainmeterSetVariable.

If you specify an alpha amount on the ImageTint statement, that alpha will be added to the image. If you have an image (.png) that already is partially transparent, this can be used to make it "more transparent". It cannot be used to make it "more opaque" however. The alpha value is added, not replaced, in the image. So an alpha of 255, much like with colors, means "make no change" and can be used to restore the original transparency of the image.

P.S. If you want finer control over the tinting / colorizing of an image meter, you might look at ColorMatrix: http://rainmeter.net/cms/Tips-ColorMatrixUnleased

Perhaps I should mention that the color values are not actually "added" in a mathematical sense. Rather they are multiplied in a way. Specifying an ImageTint of 128,128,128 will effectively multiply all the color values by 0.5 (making it darker). That's the reason you can't make an image brighter or more opaque with this, because you can't add anything and you can't multiply by something larger than 1 (meaning values above 255).