Why does grayscale SVG become less bright when converted to alpha?

Question

I'm trying to create a transparent "starry night" effect using SVG. I placed the SVG inline within a black background element on the web page. I started with a turbulence filter and then applied a color matrix to get the desired effect:

<svg xmlns="http://www.w3.org/2000/svg">
    <filter id="filter">
        <feTurbulence baseFrequency="0.2" />
        <feColorMatrix values="
            0 0 0 1 -.5
            0 0 0 1 -.5
            0 0 0 1 -.5
            0 0 0 0 1" />
    </filter>
    <rect width="100%" height="100%" filter="url(#filter)" />
</svg>

...gives:

But this doesn't have alpha transparency; I want it to represent a plane of white pixels whose brightness is only reduced by being on a black background and having less opacity. So I put it through a second filter to do this:

<svg xmlns="http://www.w3.org/2000/svg">
    <filter id="filter">
        <feTurbulence baseFrequency="0.2" />
        <feColorMatrix values="
            0 0 0 1 -.5
            0 0 0 1 -.5
            0 0 0 1 -.5
            0 0 0 0 1" />
        <feColorMatrix values="
            0 0 0 0 1
            0 0 0 0 1
            0 0 0 0 1
            1 1 1 0 0" />
    </filter>
    <rect width="100%" height="100%" filter="url(#filter)" />
</svg>

...gives:

This is very similar, but slightly darker. Why is it slightly darker? When overlaid on a black background, shouldn't logically it produce the same pixel color?

Answer 1

As Robert pointed out above, color space conversion can produce some weird behavior. After the second color matrix, the pixels should actually be brighter. It seems you can solve this problem by adding an extra feComponentTransfer with SQRT(1/2.2) as the exponent value.