Recolorify
Sign inStart free →
DESIGN6 min read· Jun 22, 2026

The Ultimate Guide to Yellow Color Codes, Hex Codes, and Shades of Yellow

Yellow is the color of optimism, attention, and clarity — it grabs the eye faster than any other hue, which makes it powerful for highlights, warnings, food brands, and energy. Whether you are a web designer matching co-brand assets, an e-commerce manager building variant listings, or a developer wiring up a design system, color codes are your shared language. In this guide we break down the hex codes, RGB coordinates, and LAB parameters for the most popular shades of yellow, with practical tips on recoloring assets into these exact tones without quality loss.

The Ultimate Guide to Yellow Color Codes, Hex Codes, and Shades of Yellow

The core yellows and their codes

  • Pure yellow — #FFFF00 · RGB(255, 255, 0) · HSL(60°, 100%, 50%) — the standard maximum-brightness web yellow.
  • Gold — #FFD700 · RGB(255, 215, 0) · HSL(51°, 100%, 50%) — a rich metallic yellow for premium accents.
  • Mustard yellow — #E1AD01 · RGB(225, 173, 1) · HSL(46°, 99%, 44%) — muted and earthy, a fashion and decor staple.
  • Lemon yellow — #FFF44F · RGB(255, 244, 79) · HSL(56°, 100%, 65%) — bright and zesty, fresh for food and youth brands.
  • Amber — #FFBF00 · RGB(255, 191, 0) · HSL(45°, 100%, 50%) — a golden yellow-orange for warmth.
  • Cream — #FFFDD0 · RGB(255, 253, 208) · HSL(57°, 100%, 91%) — soft off-white yellow for backgrounds.

Why hex alone isn't enough for recoloring

A hex code defines a target color, but it says nothing about lightness. Yellow is the trickiest hue to recolor because it sits at the top of the lightness scale — a flat RGB swap to mustard or gold blows out the highlights and flattens folds and shadows, so the result looks fake.

This is why perceptually-uniform spaces matter. LAB separates lightness (the L channel — folds, highlights, shadows) from the color itself (A and B). Recoloring in LAB lets you hit an exact yellow hex while every shadow and texture detail of the original survives. The same logic applies to OKLCH, which keeps perceived lightness constant as you shift hue — essential for a hue this bright.

Matching brand yellows across assets

Yellow shows compression artifacts and drift more than darker hues because there is so little lightness range to hide them — a logo yellow and a product-photo yellow that started identical can quickly look mismatched. Define each brand yellow once — with a name, a hex, and a use case — and recolor every asset to that exact value rather than eyeballing it.

With Recolorify you can paste an exact yellow hex and recolor a logo, product photo, or garment to match it precisely, keeping texture intact. See also our guides to orange color codes and green color codes.