Advertisement


Why does my hexadecimal color in one browser render differently in another browser?


Question

On the left is how it is rendered in Chrome, and on the right is how it is rendered in Safari. The color in Safari is what I am trying to nail, as determined by Photoshop's eyedropper tool, so it's rather peculiar to see it render differently when displayed on Chrome.

Any help will be very much appreciated, thank you!

Color Difference

2014/06/06
1
2
6/6/2014 10:23:00 AM

Colors are not numbers, not really. The computer uses numbers to represent a color, but it may or may not be aware of the conditions under which the color is shown.

Different hardware have different capabilities and will thus show different color for same numbers. There isnt really anything you can do about the differences in the physical world.

You can however, try to compensate for the difference. If you happened to know what the difference is in some known reference color space. This is called color matching. Color matching has however lots of caveats, such as what to do when color can not be represented etc.

The description of the capabilities and settings of the device is called a profile. It describes how the system is compared to reference space.

In anycase what your seeing happens when the 2 color engines arent configured properly or the other engine turned off or nonexistent. In this case since your building for the web it hardly matters. Since you can not guarantee the other end. 90% of users rely on factory or no profiling. This means that the color will vary on different devices and theres little you can do about it. The best you can hope for is a sRGB configured system.

So while it would be possible to match the colors on your computer. It wouldnt really matter in the grand schene of things.

2014/06/06
3
6/6/2014 5:32:00 AM