Firefox displaying image colours incorrectly

Question

I have a website that incorporates a logo in to the header. This logo has a background that is the same colour as the background of the header, yet in Firefox the colour is different.

I can find various articles alluding that the 'colour profile' being the culprit, but I cannot find out how to fix this issue.

Quite why anyone would think that changing the colour of an image is the way forward I don't know, but it looks very poor, so I'd be grateful for some suggestions on how to fix this.

To create the original image I used GIMP, and it has been exported as a PNG.

Here is a section of the header so that you can visually see what I mean - enter image description here

score 1 · Accepted Answer · answered Oct 28 '13 at 15:25

1

Since you do not provide the original image, I have to make an educated guess: Your image most likely has a (broken, incorrect) color profile embedded. Fix or remove the color profile and you should be good. See the documentation of your favorite tool on how to do that.

answered Oct 28 '13 at 15:25

nmaier

32,336
5
63
78

The current colour profile of the image is sRGB. I cannot see a way of removing the profile, and the GIMP docs seem to suggest that this is the default. You suggest that the colour profile may have become corrupt, so I created a new image of the same size, and then copied and pasted the old image. I exported this over the old image, reloaded my page, and it was fine. So thanks, I was unaware a colour profile could become corrupt! – David Gard Oct 28 '13 at 16:45

score 1 · Answer 2 · answered Oct 28 '13 at 15:26

1

You should use some tool like tweakpng to check if the PNG has a color profile, and remove it.

answered Oct 28 '13 at 15:26

leonbloy

73,180
20
142
190

Thanks for the link. No doubt it'll become more useful as I start to do more work with graphics and logos. – David Gard Oct 28 '13 at 16:47

Firefox displaying image colours incorrectly

2 Answers2