Essential cookies keep Huevex running. With your permission we also measure how the site is used. Nothing optional loads until you choose. Cookie Policy
Gray is the largest family in this library, and the one designers underestimate. It is not a single color but a line between black and white, and small differences along that line decide whether an interface feels expensive or flat. A cool gray reads as technical and glassy; a warm gray reads as paper and stone.
The swatches below are ordered from the lightest tint to the darkest shade, from near-white through the mid grays that carry most interface backgrounds, down to the charcoals used for type. Because gray holds no hue of its own, it is the fastest way to judge how the colors around it are working. Each swatch lists its name, hex and RGB codes, and each links to readings for contrast, tints and shades.
Read from the top, the list passes through the values that make up most interface surfaces: the near-whites used for cards, the mid grays behind secondary text, and the charcoals used for type. Most of the work is in choosing a small number of steps and staying with them; a page that mixes five similar mid grays looks unfinished even when every individual value is fine. The coolest and warmest entries at either end are the ones that set the temperature for the whole set.