HTML and CSS Reference
In-Depth Information
Short hexadecimal notation
There is a short form of the hexadecimal notation in which the color is specified using
only three hexadecimal digits instead of six. This notation can be converted to the
hexadecimal notation by duplicating each digit.
p { color: #f00; } /* same as #ff0000 */
The short hexadecimal notation is a useful shortcut when the full precision provided
by the longer hexadecimal notation is not needed.
RGB notation
The
rgb()
function allows a color value to be specified as three intensity values for the
color components red, green, and blue. The value can be either an integer between 0 and
255 or a percentage.
p { color: rgb(255, 0, 0); }
p { color: rgb(100%, 0%, 0%); }
The RGB notation allows the same color precision as the hexadecimal notation.
The notation used comes down to a matter of preference, but the hexadecimal notation
is often preferred because it is shorter and can easily be copied from an image editor,
for example.
RGBA notation
CSS 3 introduced the RGBA notation, adding an alpha value for specifying the color
transparency. This alpha value is a number between 0.0 (fully transparent) and 1.0
(fully opaque).
/* Red with 50% transparency */
p { color: rgba(100%, 0%, 0%, 0.5); }
RGBA color values are supported in Chrome, Firefox 3+, IE9+, Safari, and Opera 10+.
If support is not present, the rule is ignored, so a fallback color value can be set as
shown here:
p {
color: rgb(100%, 0%, 0%); /* fallback */
color: rgba(100%, 0%, 0%, 0.5);
}
A browser that does not support RGBA ignores the second declaration and continues
to apply the opaque version.
