Yellow Color

Learn about Yellow (#ffff00): its uses in web design, HEX/RGB/HSL values, complementary and analogous color schemes, tints and shades, and accessibility contrast recommendations.

#ffff00
HEX #ffff00
RGB rgb(255, 255, 0)
HSL 60°, 100%, 50%

About Yellow Color

Yellow is the brightest color on the spectrum, associated with optimism, happiness, and attention. It works well for warnings and cheerful brands.

Use Cases for Yellow

warning signschildren brandssummer campaignshighlightingoptimistic branding

Shades & Tints of Yellow

#ffffff
#ffffbf
#ffff80
#ffff40
#ffff00
#bfbf00
#808000
#404000
#000000

Complementary Color

#ffff00
#0000ff

Analogous Colors

#ff8000
#ffff00
#80ff00

CSS Code

.yellow-color {
  color: #ffff00;
}

Contrast Recommendations

Black text on Yellow
Ratio: 19.56:1 ✓ Passes AA ✓ Passes AAA
White text on Yellow
Ratio: 1.07:1 ✗ Fails AA ✗ Fails AAA

Frequently Asked Questions

What color is Yellow?

Yellow is represented by the hex code #ffff00 and has RGB values of rgb(255, 255, 0). It falls under the Yellow category.

How to use Yellow in web design?

Yellow works well for warning signs, children brands, summer campaigns. Yellow is the brightest color on the spectrum, associated with optimism, happiness, and attention. It works well for warnings and cheerful brands. Use it as a primary color, accent, or background depending on your design needs.

What colors go with Yellow?

Colors that pair well with Yellow include gold, lightyellow, lemonchiffon, palegoldenrod, khaki. For a complementary scheme, try #0000ff. For an analogous scheme, use #ff8000 and #80ff00.