javascriptphotoshopeaseljscolormatrixrainmeter

Convert Photoshop HSL Adjustment layer to Color Matrix?

I'm having a nightmare with colour matrices. I'm using an adjustment layer in photoshop with the values Hue: -37, Saturation: -25 which results in a nice pinky dawn colour:

Photoshop Adjustment Layer

I'm trying to use EaselJS to create my matrix based on the values in my HSL adjustment layer for Rainmeter (which can only use these), so I'm generating my matrix like so:

new createjs.ColorMatrix().adjustColor(0, 0, -25, -37);

See here: http://www.createjs.com/docs/easeljs/classes/ColorMatrix.html#method_adjustColor

This results in a bright green colour as you can see:

Bright green

Is there another way to generate my colour matrix? Can I convert A Photoshop adjustment layer to a colour matrix? Could the difference in results be related to not having Colorize checked?

Solution

  • The answer to this turned out to be fairly simple. The matrixes generated were correct with slight differences. These differences turned out to be because a Photoshop HSL adjustment layer also changes the brightness and contrast. I believe that Lightness is a function of Brightness and Contrast although I'm not sure how it is worked out so it's not easy to get it perfect. Trial and error basically.

    The reason my colours were totally wrong before was down to the fact that the array generated by ColorMatrix.js fill the matrix top to bottom not left to right.

    i.e.:

    Array [0, 1, 2, 3, 4, 5, 6, 7, 8, 9]

    Becomes:

    Matrix [[0, 2, 4, 6, 8],
        [1, 3, 5, 7, 9]]

    Shortened for example, true colour matrix will be a 5x5 matrix.