Use color, RGB or hexa names?

I'll leave some points in favor of both:

1. Ease of maintenance and modifications during development:

Changing the tone of a color to darker or lighter or even apply an opacity is simpler with hex and rgb, simply increase or decrease the values and add alpha:

Perhaps background-color: #ff0000; is not quite what you wanted, maybe a darker red with a small opacity, just use rgba(200, 0, 0, 0.7) or #99000099 (RGBA hexadecimal notation (#RRGGBBAA, #RGBA) is not supported in all browsers )

2. Simpler to burn

If you want to use only color names, you will need to consult another place every time to find out what the name of that color is, or to record the name of various colors

Using RGB or HEX just understand that colors are made up of three parts (4 if you use opacity):

#001122                        rgb(0, 1, 2)
00 -> vermelho      OU         0 -> vermelho
11 -> verde                    1 -> verde
22 -> azul                     2 -> azul

Knowing this is just a mix

3. "This is the color"

Maybe you are surfing the internet and suddenly look at a website, ad or something and "this is the color" you were searching for on your site, what do you do? if at least what I do, I inspect the element and see the color used, if it is an image, the chromer allows that by passing the mouse over it it tells you what is that color in HEX, RGBA and HSLA, but does not say the name of the color, for that would be one more step, look for some converter and see what the name of the color

Of course, using the names has its advantages:

1. It's more intuitive, at least for me

If you are making a quick and simple change, the first thing you think about when you put a gray background is gray and not #808080 or rgb(128, 128, 128)

2. Help in English

If you want to learn, perfect or even study for proof, using color names already helps

Note: it is possible to use color-coded opacity, but it is necessary to use one more attribute ( opacity ), but, in my opinion, GRB or HEX is much easier, since opacity applied by% is in all, background colors, text, border ... if you just want to apply to one of these will work

The biggest difference is in your power of color definition, using HEX you can define much more precisely the color you want than using RGB and the literal name. Furthermore, even with browsers searching for a standardization, two browsers may have slight differences for a same color defined by the literal name.

An interesting point is to use HEX makes the page render a little faster , the difference is "more noticeable" if you add RGBA in the list.

Outside the links added above these posts can complement the reading:

link

link

Names in the SVG 1.0 standard

I believe the answer is in the documentation itself that you have put as a reference in the question. I put in the title the link to the page in Portuguese for the part that talks about the use of color names, which seems to be your main doubt.

In summary, you can use the names with some care.

• Use the names defined in the SVG standard (CSS 3)
• If you run in IE < 8% care of the names: grey , darkgrey , darkslategrey , dimgrey , lightgrey and lightslategrey because they are accepted or terminated in gray instead of gray in those versions .
• Remember that some names are synonyms for the same color
• Named colors will not give you transparency feature
• Do not use OS-related color names because they have been discontinued

So I see no problem using color names, but how did you put Guilherme in the response from him you have the advantages and disadvantages of using only the names.

If it is a question of standardization, it may be a good idea because you narrow the palette and do not err in different shades; otherwise, depending on the design you may need a wider range of shades and colors and only with the names will not achieve its goal.

You can specify colors with at least 10 different shapes according to the latest draft of CSS Color Module .

This is a test that shows these forms:

.colorName{
   color: red
}

.colorRGB{
  color: rgb(255, 0, 0)
}

.colorRGBA{
  color: rgb(255, 0, 0, 50%)
}

.colorRGBP{
  color: rgb(100% 0% 0%)
}

.colorHSL{
  color: hsl(0, 100%, 50%)
}

.colorHSLA{
  color: hsl(0, 100%, 50%, 50%)
}

.colorHWB{
  color: hwb(0  0%  0%)
}

.colorGray{
  color: gray(50)
}

.colorCMYK{
  color: device-cmyk(0 100% 100% 50%);
}

.colorHex{
   color: #ff0000
 }

<h2 class="colorName">O rato roeu a rolha da garrafa do rei da russia</h2>
<h2 class="colorRGB">O rato roeu a rolha da garrafa do rei da russia</h2>
<h2 class="colorRGBA">O rato roeu a rolha da garrafa do rei da russia</h2>
<h2 class="colorRGBP">O rato roeu a rolha da garrafa do rei da russia</h2>
<h2 class="colorHSL">O rato roeu a rolha da garrafa do rei da russia</h2>
<h2 class="colorHSLA">O rato roeu a rolha da garrafa do rei da russia</h2>
<h2 class="colorHWB">O rato roeu a rolha da garrafa do rei da russia</h2>
<h2 class="colorGray">O rato roeu a rolha da garrafa do rei da russia</h2>
<h2 class="colorCMYK">O rato roeu a rolha da garrafa do rei da russia</h2>
<h2 class="colorHex">O rato roeu a rolha da garrafa do rei da russia</h2>

Support for some of these forms (eg hwb) may be practically non-existent. What I have seen so far is there are javascript libraries to provide the due suport. As you can see in W3Schools example

You can even consult the support of this specification in your browser. The specification includes a test suite that allows you to check the support for your browser .

But responding more specifically to your question you should use the one you want. Eventually your choice may be related to the color scheme you are used to or the one that best suits the circumstances.

If you are used to an additive color scheme (RGB) then you will use RGB. If you are used to a subtractive color scheme (CMYK) then you will use CMYK.

If you are a designer and work a lot with the HSL color scheme then you can use HSL.

The fact that the RGB scheme is widely used in the computing world is because the screens have a black background, so an additive color scheme like RGB works better than a subtractive scheme. You can see the subtractive color scheme working in printers, since they print on white paper. ref

Contundo I think a caveat can be made, but it is something subtle and optional. You may want to associate a particular color with a common state in your web application. For example: red for error, yellow for warning, blue for information.

And humans are more accustomed to recognizing names than numbers (which is why there are DNS - but that's another matter). So that in these occasions you may want to prefer the name of the color in relation to any other alternative.