Shades of Yellow
Yellows cover roughly 45° to 65° on the HSL wheel, centered on 60°. Yellow is the lightest of all fully saturated hues: at hsl(60 100% 50%) it has far more luminance than blue at the same HSL lightness. It also cannot be dark. Lower its lightness and it turns olive or mustard, which is why the family is dominated by bright and pale colors, with low-chroma creams and khakis at the soft end. In RGB, pure yellow is red and green at full strength with no blue, rgb(255, 255, 0); adding some blue pushes it toward cream, as in lemonchiffon's rgb(255, 250, 205).
Pure yellow is #FFFF00. Gold (#FFD700) sits at 51°, warmer and slightly orange. Khaki (#F0E68C) and palegoldenrod (#EEE8AA) are muted, sandy yellows, and lemonchiffon (#FFFACD) is a very pale tint that works as a warm background.
12 yellow CSS color names
Sorted from lightest to darkest by OKLCH lightness. Open any color for its codes, shades, harmonies and contrast.
Using yellow in design
Yellow grabs attention faster than almost any other color, so it is used for caution states, highlighted text, warning banners and sticky-note style callouts. Brands use it for optimism and low prices. Because it is so bright, a little goes a long way: a yellow accent on a dark or neutral layout stands out more than a yellow page does.
Accessibility tip: yellow text on white almost always fails. Pure yellow on white is 1.07:1, and even gold is 1.40:1. Flip the pairing instead: black text on yellow measures 19.55:1, so use yellow as a background behind dark text.