CSS - RGB or HEX for color
I believe that it is mostly a matter of personal taste whether you should use RGB or HEX. Personally I use HEX, because it feels more convenient - it is easier to scan when reading the code and easier to copy from your preferred image editor. Also for colors like white (#fff), black (#000) it could save you a few bytes (not that it would make much difference though).
In the end it is really just two different representations of the same thing, and from a performance perspective I don't think it matters. At least there are loads of other things you can do to increase performance, that will have a greater impact on performance.
What is the benefit of specifing RGB color in HEX Value?
Answer here?
Hex values are easier to copy and paste from image editors, normally easier to remember as it's only 6 digits and can easily become more compact, e.g. #fff
vs rgb(255,255,255)
It is recommendable to type the color's name instead of its hex value in CSS?
I'll prefer the hex value since it is supported by all browsers and I can specify wide range of colors than the named colors.
Efficiency of color selection in html. RGB vs hex vs name
I think it's safe to say that browsers will render pages faster if you use the #rrggbb color hashes in your CSS.
I made a super-trivial web page that put a background and foreground color on the body element via CSS, an a little JS at the bottom of the page on a timeout to output the first render time (unfortunately I used the performance.timing.msFirstPaint value, so it will only work in IE, but you can get the gist from this). I rendered the page ten times and took the average. Then I changed the color names ("green" and "white") in the CSS, changed them to hex values (#008000 and #fff) and repeated the measurements. Using names, the page rendered in an average of 41.6ms; using hex values: 14.5ms. Given how simple the test page is, with only two colors, I feel that's a pretty significant difference.
<!DOCTYPE html><html><head> <meta charset="utf-8" /> <title>Color name test</title> <style>body{background-color:green;color:white;}</style></head><body> <h1 id="foo"></h1> <script> setTimeout(function () { var start = performance.timing.domLoading; document.getElementById("foo").innerHtml = performance.timing.msFirstPaint - start; }, 1000); </script></body></html>
How are hex codes converted to RGB 255 values?
Its the number base.
(FF)_16 = 15*16^1 + 15*16^0 = (255)_10
FF are in base 16 while your 255 are in base 10. so you will need to apply base conversion to get the number in the other base.
you may wanna read up more about it from this link
Performance differences between color declarations?
If we assume a modern browser making full use of the GPU then the internal color representation will be RGB floats. Ignoring the color name - which is probably just a map to hex anyway - I think that hex and channels will be the fastest. HSB will undoubtedly be the slowest, as the conversion from HSB to RGB does require some work - about 50 lines of C code.
However, I think that for the purpose of CSS, this is a completely irrelevant question. Even for HSB to RGB the amount of work on one color will be totally trivial. By way of support for this, I have several programs - including those running on mobiles - which do color manipulation at a per-pixel level on largish images where I am doing RGB->HSB->(some manipulation)->RGB. Even performing this operation 100,000 times on an ipad only results in a delay of a couple of seconds - so on this relatively slow platform, I think your typical worst case conversion can be safely assumed to take less then 0.0001 seconds. And that's being pessimistic.
So just use whatever is easiest to code.
ADDED: to support the don't worry about this option. Internally a GPU will manipulate colors as an array of floats, so in C terms
float color[4];
or something similar. So the only conversion being done for the numeric options is a simple divide by 255.
On the other hand conversion of HSB to RGB takes considerably longer - I'd estimate, from having written code to do it, about 10 to 20 operations. So in crude terms HSB is considerably slower, BUT 20 (or even 20,000) operations on a modern GPU isn't worth worrying about - it's imperceptible.
Is there a reason to use uppercase letters for hexadecimal CSS color values?
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'.
Related Topics
Google Maps V3 - Prevent API from Loading Roboto Font
How to Align Items in a <H:Panelgrid> to the Right
How to Extend CSS Class with Another Style
How to Apply Border Radius in IE8 and Below IE8 Browsers
Is Box Sizing Inherited If Declared Inside Universal Selector
I Need an Overflow to Truncate from the Left, with Ellipses
Correct Terms and Words for Sections and Parts of Selectors
Comparison of Loading CSS Inline, Embedded and from External Files
3 Columns, Center Column Fixed, Sides Fill Parents
Why Doesn't Min() (Or Max()) Work with Unitless 0
Using CSS to Make Table's Outer Border Color Different from Cells' Border Color
Put Background Image Over Text
Equal Height of Elements Inside Grid Item with CSS Grid Layout
How to Reset a CSS Variable (Aka Custom Properties) and Use the Fallback One