Website colors

The web colors are those colors that appear on a web page. They can be based on the RGB or HSL color systems. In CSS code (and formerly in HTML) they are specified as numeric values, although there are colors that can also be used for their English names.

RGB

Theoretical foundation

A hex triplet is a six-digit, three-byte hexadecimal number used in HTML, CSS, SVG, and other computer applications to represent colors.

The RGB color palette (RGB in Spanish) basically consists of three additive primary colors: Redeye, Vgreen, Ablue.

These additive primary colors, in HTML, are represented by three hexadecimal pairs of the type 0xHH-HH-HH according to the following format: (the basic or primary colors, not those that are the result of mixtures).

The values that each of the three hexadecimal pairs can adapt range from 0x00 (0 decimal) to 0xFF (255 decimal). The greater the value of the pair, the greater the intensity (hue, brightness, or lightness) of the color corresponding to that pair (and vice versa). This implies that the lower end of the chromatic scale starts from a minimum color intensity (degree) (null = even 0x00), passes through a medium color intensity (medium = even 0x80 [128 decimal]) until reaching a maximum color intensity (saturated = even 0xFF). The degree of highest purity (absolute) of an additive primary color will be determined by its total presence (saturation = 0xFF) together with its total absence ( null = 0x00) of the other two additive primaries.

In addition to these three additive primary colors (RVA), there are three subtractive primary colors or CMY (CMA in Spanish): Cian, Magenta, Ayellow. These colors arise from the following combination (mixture) of the additive primaries:

Cian = Green + Blue

Magenta = Blue + Red

Yellow = Red + Green

Regarding its degree of purity, something inverse occurs to the additive primary colors, since the absolute degree will be determined by the nullity of one of its components and the saturation of the other two. The complementary colors of the primaries, both additive and subtractive, will be reciprocally:

Red ▪ Cian

Green ▪ Magenta

Blue ∙ Yellow

Simultaneous combination of the three saturated additive primaries produces white (0xFFFFFF). Conversely, the simultaneous combination of the three null subtractive primaries produces black (0x000000). It is also clear that the combination of two mutually complementary colors will produce white, in the same way that the subtraction (absorption) of both will produce black (total absence of color). So e.g. For example, red (0xFF0000) plus its complement, which is cyan (0x00FFFF), generate white (0xFFFFFF). In fact, cyan is nothing more than the subtraction of red from white. Observe the following graph:

For its part, the medium gray (0x808080), which is the exact middle term between black and white, will be obtained from the simultaneous combination of the three medium additive primaries. Similarly, semi-saturated (light) gray will be obtained from the combination 0xC0C0C0, while semi-saturated (dark) gray will be obtained by 0x404040. In this way, we have that the rest of the colors, which are between black (0x000000) and white (0xFFFFFF), arise from the combination of the three additive primaries to different degrees. In other words: just replace each of the 0xHH-HH-HH pairs with a value between 0x00 and 0xFF to get any of the possible colors.

There are 16,777,216 different combinations in the 24-bit RGB system, and therefore 16,777,216 colors: 256 × 256 × 256 = 16,777,216. In practice, however, there may be some combinations that are not are valid. That happened in the old days, when the largest color palette had 256 colors (8 bits). For this reason, there are 216 safe colors, which will be visible on any device without the need for dithering, reserving the other 40 colors for the system, some of which are shown here.

HSL

In the HSL color system, colors are measured by three parameters (hue, saturation and light) that determine the position of the color in the HSL color cylinder. The first parameter is the horizontal angle, the second is the horizontal distance from the center of the base, and the third is the vertical distance (height) from the center of the base.

Alpha

A color can be displayed with a certain opacity on screen, which is determined by the parameter alpha, which, added to RGB and HSL, converts them to RGBa and HSLa.

Equivalences

Among web systems there are some contradictions that can be summarized in the following table:

Color table

The following color chart has been adopted for use by W3C/CSS, HTML/X11, Mozilla, SVG, Internet Explorer (IE)/Microsoft Windows, etc.