How are tintcolors calculated?

Questions
1

When I apply a tint color on a layer, according to the docs “Each pixel color value is multiplied by the tint color.” When I also apply a tint color on a group that the layer is a child of, how is the color then calculated?

The docs say “The tint color can also be set on a Group Layer in which case it is inherited by all layers in the group.”

But this does not seem to be true. At least on the macOS version of Tiled I see there is some blending or other calculation going on.

For example RGB(255, 0, 0) on the group and RGB(0, 255, 0) on the layer makes the tiles completely black, no matter what the color of the tile pixels themselves are.

Is this a bug? If not, how are the tiles on a layer tinted if there are (multiple) parent groups that also have tinting enabled?

2

The tint color is applied by multiplication, so the rendered pixel value is tintColor * pixelColor, or:

renderedColor.a = tintColor.a * pixelColor.a;
renderedColor.r = tintColor.r * pixelColor.r;
renderedColor.g = tintColor.g * pixelColor.g;
renderedColor.b = tintColor.b * pixelColor.b;

(at least, this is the idea, but I see the handling of the alpha channel might be a bit off)

Now, when setting a tint color on a parent layer, it just adds an additional multiplication:

renderedColor.a = parentTintColor.a * tintColor.a * pixelColor.a;
renderedColor.r = parentTintColor.r * tintColor.r * pixelColor.r;
renderedColor.g = parentTintColor.g * tintColor.g * pixelColor.g;
renderedColor.b = parentTintColor.b * tintColor.b * pixelColor.b;

This explains why if you tint a layer green with rgb(0,255,0) and then tint its parent red with rgb(255,0,0), you get black. It’s as if you would overlay a red and a green color filter:

image

3

Thank you for the information. I found that I had to use colors in the extended range color space to make it work :slight_smile:

4

Ah, sorry I forgot to mention that indeed the multiplication works in floating point values, where 0-255 are mapped to 0-1.

1 Like