Space-separated functional color notation
Unless you need to support old browsers, you can, and probably should, write colors using the newer space-separated syntax. That doesn’t get you anything extra for the sRGB-based notations we have already looked at, but as the newer color formats, which we will look at momentarily, also use the space-separated syntax, you may as well just use the same style for all.
So, space-separate the color values, and then if you need an alpha channel, add a forward slash (/) before adding the alpha as either a decimal value or a percentage.
For example:
.redness-alpha-rgba {
color: rgb(254 2 8 / 0.8);
}
Or, if you prefer percentages:
.redness-alpha-rgba {
color: rgb(254 2 8 / 80%);
}
So, now you know the syntax we will be using for all the new color formats, let’s cover some groundwork before taking an in-depth look.