This study is intended to provide a general reference on the light-dark sequence of the major named color groups.
Color in HTML and CSS code for the web can be specified as named colors, RGB and RGBA on a scale of 0–255 levels (“A” for opacity on a scale of 0–1.00, where 1.00 is opaque), and hexadecimal (3 or 6 base-16 numbers on a scale of 0–F).
The named color palette consists of 140 colors that can be specified by name, such as “aliceblue,” “chartreuse,” and “lavender.” They include colors that generally fall within the categories of gray, red, green, blue, cyan (turquoise or aqua), magenta (purple, lavender), and yellow (beige).
Named colors make it easy to identify colors by name, whereas from RGB and Hex specifications it may be difficult to identify the color. At the same time, using named colors makes it difficult to pick out the desired shade, e.g., if you want to use gray instead of black for a border, should you use gray, darkgray, or dimgray? In the colorbar below, note that darkgray is actually lighter than gray, and the darkest is dimgray.
In this study, named colors falling into the general categories of red, green, blue, yellow, magenta, and cyan were arranged in from light to dark based on (1) average RGB values, as an analog of print neutral density, and (2) CIELAB L* lightness value.
| white 255 L100 |
whitesmoke 245 L97 |
gainsboro 220 L88 |
lightgray 211 L85 |
silver 192 L77 |
darkgray 169 L69 |
gray 128 L54 |
dimgray 105 L45 |
Sample of web grey colors arranged by average RGB (neutral density, higher is lighter) and LAB L* (luminance) values (labeled “L.”). |
|||||||