Color shades (hex, rgba, color labels)

Occasionally, employing a color selector may suffice in selecting a hue to operate with. However, for precision, a more specific approach is required.

Web colors are portrayed in three typical methods:

• Color labels
• Hexadecimal codes
• RGBA

Color labels

HTML color labels are the familiar color labels for 140 hues supported by up-to-date browsers.

It’s simpler to recollect and utilize “Violet” instead of #0000FF. However, most of these labels are relatively random like LawnGreen, PeachPuff, BlanchedAlmond, etc.

Moreover, HTML color label lists do not encompass the full range of potential web colors. Hence, for a broader selection of hues, considering other formats is advisable.

Hexadecimal codes

Hexadecimal codes typically consist of six-character codes corresponding to precise color outputs.

They are also referred to as hex triplets since they consist of three groups of two digits: red, green, and blue—identical to the three colors composing each pixel on a display.

Augmenting a specific color’s value increases the prominence of that hue in the result. Manipulating red, green, and blue allows for a vast array of possible hues.

Hex

Individual color values are represented in the hexadecimal numbering system. This system covers digits from 0 to 9, then incorporates the letters a through f before transitioning to 10.

Abbreviated hex

Abbreviated hex signifies the reduction of a 6-digit hexadecimal to a 3-digit format.

If a hue’s color values have repeating digits in all three sets, like AA-BB-CC or 44-11-EE, the second digit for each color can be omitted, simplifying it to ABC or 41E.

For instance, white is #FFFFFF and can be abbreviated as #FFF.

RGBA

Conversely, RGBA values are displayed using the base-10 numbering system.

RGBA utilizes values from 0 to 255 to identify each color: red, green, and blue—an inclusive spectrum of red, starting from zero.

The ‘A’ denotes Alpha transparency. Consequently, with RGBA, the transparency level can be controlled from completely transparent (0) to entirely opaque (1). Lower alpha values imply increased transparency, while higher alpha values indicate heightened opacity.

The color picker and the eyedropper tool are additional options for visually selecting your color.