Blue and yellow color palettes

Blue and yellow sit roughly opposite each other on the color wheel (about 160° apart), which makes them complementary: each makes the other look more saturated. That contrast is the point, and also the risk. Let one color dominate the surface and use the other as the accent, rather than splitting the space evenly, or the two will compete.

In practice, blue recedes and reads as trustworthy, so it suits large surfaces and primary actions, while yellow is the brightest hue and needs a dark partner for any text. The palettes below combine both families, strongest matches first; open any of them to see its contrast matrix and copy the hex codes, CSS variables or Tailwind config.

Hue contrast is not text contrast: two colors can look completely different and still fail WCAG as text and background. Every palette page shows which pairs pass, and the contrast checker suggests the nearest passing shade.