Hexadecimal Notation

Hexadecimal RGB (red, green, blue) notation is perhaps the most common format. It consists of a # character followed by three or six hexadecimal digits. When six digits are provided, the first pair represents the red value, the second pair represents the green value, and the last pair represents the blue value: #rrggbb. A value with three digits represents the corresponding six-digit value where each digit occurs twice; thus #09f is the same as #0099ff (red=00, green=99, blue=ff).

Decimal Notation

We can also write a color value with decimal functional notation—rgb(0, 160, 255) or rgb(0%, 63%, 100%)—where the order of the arguments is red, green, and blue. Using the first form, 255 corresponds to 100%. Values outside the valid range (0–255 or 0%–100%) are automatically changed to the corresponding limit.

CSS3 makes a few extra functional notations available:

• rgba(0, 160, 255, 0.2) for RGBA colors; the fourth argument is the alpha opacity and accepts a value from 0 to 1
• hsl(240, 100%, 50%) for HSL colors (hue, saturation, luminosity)
• hsla(240, 100%, 50%, 0.2) for HSLA colors (hue, saturation, luminosity, alpha)

At the time of writing, these three notations were supported only by the Gecko¹ and WebKit² rendering engines.

Keywords

Colors can also be represented by the keywords listed in Table 1.

Finally, you can use the keywords listed in Table 2 to specify system colors—various colors that are used by the operating system and/or window manager, and can be applied when you want to create a “native application” look and feel.

Note that even though the keywords are case insensitive, they’re presented here as they are in the CSS2.1 specification, for maximum readability.