Is there a reason to use uppercase letters for hexadecimal CSS color values?

smonff picture smonff · Sep 21, 2015 · Viewed 20.1k times · Source

I see that colors in CSS properties values are commonly written in the uppercase form:

.foo .bar {
  background-color: #A41B35;
  color: #FFF;
}

But you can also use:

/* Same same */
.foo .bar {
  background-color: #a41b35;
  color: #fff;
}

Or even the very controversial:

/* Check the link to see why it can be interesting */
.foo .bar {
  background-color: #A41b35;
  color: #FfF;
}

In any case (ho ho ho), using named colors like white, when possible, in place of #fff kind of make our life easier, but this is another question.

It looks like using lowercase values does the same, and, CSS values for colors are not case-sensitive. Lots of graphic design software also use the uppercase form. And it is very common to find uppercase notations in source code, it looks like there is something like a tradition.

I understand about the consistency thing, that it should be the same everywhere in you software, but as the standard doesn't give a good indication, people do what they want or what they are told to do.

Is there rational reasons for this, like historic, compatibility, old IE6 hacks, performances or practical reasons?

Answer

Bobby Jack picture Bobby Jack · Sep 21, 2015

I am not aware of any differences other than personal preference. Personally, I prefer lowercase since it's quicker to read, although in very short strings such as CSS color values, the benefit is probably negligible. Really, I think it's just because I think lowercase looks better.

Hexadecimal, however, is traditionally written in uppercase, so maybe I'm - strictly speaking - in the 'wrong'.