user3041764
user3041764

Reputation: 839

Different display color in Chrome and Safari

My problem concerns color display.

visible difference

I have #0565af colour image inside rounded box with background-color: #0565af;. In Safari I see two different colors. The attached picture shows the difference. How can I eliminate this difference?

Upvotes: 0

Views: 1861

Answers (1)

LOTUSMS
LOTUSMS

Reputation: 10240

Generally, browsers interpret color in different ways according to how it is written. Meanwhile some browsers prefer the most commonly used HEX nomenclature, other browsers interpret sRGB by calculating the different hues of base colors and going from there. A rule of thumb I apply professionally when in doubt is to declare both the HEX code and sRGB code into the CSS. If you are using LESS or SCSS, then you can integrate these into one mixin and render it as such.

So a normal black color, would be coded as:

.class{
   color:#000;
   color: #000000;
   color: rgb(0,0,0);
}

Refer to these links for more explanation on this known problem

Numerical color values

Colors in sRGB

And use this great tool to help you find the values you are looking for:

ColorHexa

Upvotes: 1

Related Questions