Dark text passes AAA
19.56:1

Yellow

#FFFF00

Pure yellow mixes full red and green light, which makes it the brightest of the base colors. That brightness means white text on it is nearly invisible at 1.1:1, while black text reaches 19.6:1. It works well as a highlight or background accent and poorly as a text color on white.

HEX#FFFF00
RGBrgb(255, 255, 0)
HSLhsl(60, 100%, 50%)
OKLCHoklch(96.8% 0.211 109.8)
CMYKcmyk(0%, 0%, 100%, 0%)
CMYK is an approximate screen conversion, not for print matching.

Lighter and darker

Ten steps toward white and ten toward black, with yellow in the middle. Click a step to copy its hex code.

LightestYellow #FFFF00Darkest

Readability

White text on yellowNormal text at 16px. The quick brown fox jumps over the lazy dog.
1.07:1
  • Fails AA and AAA
Dark text on yellowNormal text at 16px. The quick brown fox jumps over the lazy dog.
19.56:1
  • Passes AA normal
  • Passes AA large
  • Passes AAA normal
  • Passes AAA large

Colors that go with yellow

#FFFF00#0000FF

Complementary

The opposite on the color wheel
#FF8000#FFFF00#80FF00

Analogous

Its two neighbors
#FFFF00#00FFFF#FF00FF

Triadic

Three evenly spaced colors
#FFFF00#0080FF#8000FF

Split-complementary

The two colors beside its opposite

Yellow color palettes

Monochrome

Lighter and darker versions of the same color.

Analogous

Neighbors on the color wheel, for a calm, related look.

Complementary

The color with its opposite, for strong contrast.

Triadic

Three colors evenly spaced around the wheel, with a light and dark version.

Similar colors

  • Daffodil Yellow#FFFF31
  • Canary Yellow#FFEF00
  • Lemon Yellow#FFF44F
  • Butter Yellow#FFFD74
  • Maize#FBEC5D
  • Banana Yellow#FFE135
  • Neon Yellow#CFFF04
  • Golden Yellow#FFDF00
Shades of yellowEvery named yellow shade with hex codes

Use yellow in a tool

Check text contrast with yellowMix yellow with other colorsBuild an accessible palette from yellow

Questions about yellow

What is the hex code for yellow?

The hex code for yellow is #FFFF00. In RGB it's rgb(255, 255, 0), and in HSL it's hsl(60, 100%, 50%).

What colors go with yellow?

Its complementary color is #0000FF. For a calmer look, try the analogous colors #FF8000 and #80FF00, or one of the palettes above, which all include yellow.

Is text readable on yellow?

Dark text is the better choice, with a contrast ratio of 19.56:1. That passes WCAG AA for normal text.