#BAB936#BAB936
#BAB936 is a light, vivid yellow. Relative luminance 0.454; OKLCH L 76.3% C 0.147 H 109.0°. Best body text is #000000 at 10.08:1 contrast (WCAG AA passes).
Color values
| HEX | #BAB936 |
|---|---|
| RGB | rgb(186, 185, 54) |
| HSL | hsl(60, 55%, 47%) |
| HSV | hsv(60, 71%, 73%) |
| CMYK | cmyk(0%, 0.5%, 71%, 27.1%) |
| CIE-LAB | lab(73.16, -15.10, 62.78) |
| CIE-LCH | lch(73.16, 64.57, 103.52°) |
| OKLab | oklab(76.34% -0.0479 0.1392) |
| OKLCH | oklch(76.34% 0.147 109) |
| XYZ | xyz(38.2659, 45.4045, 10.2376) |
| Luminance | 0.4540 (WCAG relative) |
| Temperature | warm |
| Family | yellow |
Closest named colors
Puke Yellow
#C2BE0E
ΔE00 3.36
Olive Yellow
#C2B709
ΔE00 3.87
Snot
#ACBB0D
ΔE00 4.01
Mustard Green
#A8B504
ΔE00 4.07
Vomit Yellow
#C7C10C
ΔE00 4.19
Bile
#B5C306
ΔE00 4.55
Perceptual scales
Shades
Tints
Tones
OKLCH scale
Color harmonies
complementary
#BAB936 #3637BA
analogous
#BA7736 #BAB936 #79BA36
triadic
#BAB936 #36BAB9 #B936BA
tetradic
#BAB936 #36BA77 #3637BA #BA3679
square
#BAB936 #36BA77 #3637BA #BA3679
split-complementary
#BAB936 #3679BA #7736BA
monochromatic
#5B5B1A #8B8A28 #BAB936 #D0CF5D #DEDD8D
Accessibility & contrast
On white
2.08
#BAB936 on #FFFFFF
AA ✗AA large ✗AAA ✗
On black
10.08
#BAB936 on #000000
AA ✓AA large ✓AAA ✓
Best text color
#000000 on #BAB936
10.08:1 — WCAG AA (normal text) passes
Contrast matrix
| fg \ bg | ##BAB936 | #FFFFFF | #000000 | ##000000 |
|---|---|---|---|---|
| ##BAB936 | 1.00 | 2.08 | 10.08 | 10.08 |
| #FFFFFF | 2.08 | 1.00 | 21.00 | 21.00 |
| #000000 | 10.08 | 21.00 | 1.00 | 1.00 |
| ##000000 | 10.08 | 21.00 | 1.00 | 1.00 |
Color blindness preview
Protanopia (red-blind)
#C8B11F
Deuteranopia (green-blind)
#CAB640
Tritanopia (blue-blind)
#C7AD9F
Achromatopsia (no color)
#B4B4B4
Design tokens & code
CSS
--color: #bab936; /* rgb */ color: rgb(186, 185, 54); /* oklch */ color: oklch(76.3% 0.147 109.0);
Tailwind
colors: {
custom: {
50: '#d2cd76',
500: '#bab936',
950: '#000000',
},
}SCSS
$custom: #bab936; $custom-light: #d2cd76; $custom-dark: #000000;
JSON
{
"hex": "#bab936",
"rgb": {
"r": 186,
"g": 185,
"b": 54
},
"hsl": {
"h": 59.545,
"s": 55,
"l": 47.059
},
"oklch": {
"l": 0.76341,
"c": 0.14717,
"h": 109
},
"luminance": 0.45403
}Semantic roles & 50–950 ramp
primary
#BAB936
secondary
#8484C8
accent
#4BDE49
background
#FDFCF7
surface
#FAF9ED
border
#D3D2C8
text
#151309
muted
#83827B