Это происходит потому, что некоторые браузеры выполняют гамма-коррекцию, как указано в файле изображения.
Вот неисправленное изображение. Пиксели белого цвета на яблочном изображении содержат изображение груши, хранящееся с гораздо более высокой интенсивностью, то есть очень ярко.
Вот изображение с гамма-коррекцией. Пиксели черного цвета на изображении груши содержат изображение яблока, хранящегося с довольно нормальной интенсивностью, но уменьшенного до почти черного с гамма-коррекцией.
На моем экране я слабо вижу грушу среди белых пикселей на первом изображении, но на втором изображении яблоко неотличимо от черных пикселей вокруг него.
(Вы также можете увидеть некоторые цветовые полосы на груше с гамма-коррекцией, потому что в нескорректированном изображении используется гораздо меньший диапазон цветовых каналов.)
Файл изображения PNG содержит блок gAMA, определяющий значение гаммы файла 0,02. При отображении без гамма-коррекции зритель видит яблоко с вкрапленными «белыми» пикселями, которые на самом деле являются грушей с исходной (высокой) интенсивностью.
При отображении с гамма-коррекцией зритель видит грушу с цветовой коррекцией с «черными» пикселями, которые на самом деле являются изображением яблока с гораздо более низким значением гаммы.
Браузеры, которые отображают грушу, выполняют гамма-коррекцию на изображении, в то время как браузеры, которые отображают яблоко, не выполняют гамма-коррекцию, а просто показывают ее с ее буквальными значениями цвета.