yellow · electric · mid

#ffff00YellowYellow is a electric yellow — complete hex color profile

What is color #ffff00?

#ffff00, known as Yellow, is a luminous yellow with HSL 60°, 100%, 50%. Its electric saturation and mid lightness place it in a neutral part of the spectrum.

This color evokes happiness and attention, which explains why it works well in summer seasonal lines, construction signage, and attention-grabbing notifications.

Paired with its complement #0000ff, #ffff00 produces balanced contrast. For softer compositions, use it sparingly as an accent against a quieter backdrop.

Conversions for #ffff00

HEX
#ffff00
RGB
255, 255, 0
HSL
60°, 100%, 50%
HSV
60°, 100%, 100%
CMYK
0%, 0%, 100%, 0%
XYZ
77.00, 92.78, 13.85
CIE-Lab
97.14, -21.56, 94.48
Web safe
#ffff00

WCAG accessibility of #ffff00 (Yellow)

On white
1.07 : 1
Sample #ffff00
Rating: Fail
On black
19.56 : 1
Sample #ffff00
Rating: AAA

Tones of Yellow (desaturated variations of #ffff00)

Color harmonies for #ffff00

Colors similar to #ffff00

Gradients featuring #ffff00

Linear to white
Linear to black
To complement
Radial
Tri-stop
Analogous

UI elements in #ffff00

Buttons
NewFeaturedBeta
Notification

Short description with accent.

"Color awakens a specific emotional response."

Typography in #ffff00

The quick brown fox
jumps over the lazy dog
1234567890 — & @ # ! ?

Body text rendered in #ffff00.

const color = "#ffff00";

CSS & Tailwind snippets for #ffff00

Background
.bg-ffff00 { background-color: #ffff00; }
Text color
.text-ffff00 { color: #ffff00; }
Border
.border-ffff00 { border: 1px solid #ffff00; }
Box shadow
.shadow-ffff00 { box-shadow: 0 4px 14px #ffff0040; }
CSS variable
:root { --color-ffff00: #ffff00; }
Tailwind config
colors: {
  'yellow': '#ffff00',
}

Frequently asked questions about #ffff00

Explore named yellow colors