Why does this PNG display differently in Firefox vs Chrome?

Question

Here is the image:

This image has no gAMA chunk or color profiles. I tried to remove the sRGB chunk, but have not been able to, with pngcrush or pngfix.

Despite this, this image displays differently in Firefox vs Chrome (or Chromium anyway, as that's what I have). The image is much brighter in Chromium, which matches what offline image viewers like feh and nomacs display. I'm inclined to think that Firefox is wrong about this, but I'm not sure. And more importantly, how can I produce an image that will display the same?

The only related information I can find about PNGs displaying differently in browsers is all very old. Likely the most relevant question is this one. But in both Chromium and Firefox I see the pear, albeit with slightly diffrent backgrounds. In nomacs and feh I see the apple.

Answer 1

I figured it out. In Firefox I had changed the layout.css.devPixelsPerPx to 1.2 in the about:config settings because I found the default to be too small. In Chromium I had done no such thing.

For most images it wouldn't matter, but it does for this image because the pixel values are very different even when they're beside each other, so the image scaling messes things up. You can see this yourself by zooming in on this page in either browser, and seeing how the image changes.

Setting layout.css.devPixelsPerPx back to the default value of -1.0 fixed things.