#AFBA55#AFBA55
#AFBA55 is a light, vivid yellow. Relative luminance 0.449; OKLCH L 75.9% C 0.126 H 114.6°. Best body text is #000000 at 9.98:1 contrast (WCAG AA passes).
Color values
| HEX | #AFBA55 |
|---|---|
| RGB | rgb(175, 186, 85) |
| HSL | hsl(67, 42%, 53%) |
| HSV | hsv(67, 54%, 73%) |
| CMYK | cmyk(5.9%, 0%, 54.3%, 27.1%) |
| CIE-LAB | lab(72.82, -18.15, 49.13) |
| CIE-LCH | lch(72.82, 52.37, 110.28°) |
| OKLab | oklab(75.94% -0.0526 0.1149) |
| OKLCH | oklch(75.94% 0.126 114.6) |
| XYZ | xyz(36.8785, 44.8882, 15.3141) |
| Luminance | 0.4489 (WCAG relative) |
| Temperature | warm |
| Family | yellow |
Closest named colors
Light Olive
#ACBF69
ΔE00 3.67
Light Olive Green
#A4BE5C
ΔE00 3.74
Booger
#9BB53C
ΔE00 4.30
Sick Green
#9DB92C
ΔE00 5.10
Tan Green
#A9BE70
ΔE00 5.13
Darkkhaki
#BDB76B
ΔE00 5.57
Perceptual scales
Shades
Tints
Tones
OKLCH scale
Color harmonies
complementary
#AFBA55 #6055BA
analogous
#BA9255 #AFBA55 #7CBA55
triadic
#AFBA55 #55AFBA #BA55AF
tetradic
#AFBA55 #55BA92 #6055BA #BA557C
square
#AFBA55 #55BA92 #6055BA #BA557C
split-complementary
#AFBA55 #557CBA #9255BA
monochromatic
#636A2B #8C953D #AFBA55 #C3CC81 #D8DDAC
Accessibility & contrast
On white
2.10
#AFBA55 on #FFFFFF
AA ✗AA large ✗AAA ✗
On black
9.98
#AFBA55 on #000000
AA ✓AA large ✓AAA ✓
Best text color
#000000 on #AFBA55
9.98:1 — WCAG AA (normal text) passes
Contrast matrix
| fg \ bg | ##AFBA55 | #FFFFFF | #000000 | ##000000 |
|---|---|---|---|---|
| ##AFBA55 | 1.00 | 2.10 | 9.98 | 9.98 |
| #FFFFFF | 2.10 | 1.00 | 21.00 | 21.00 |
| #000000 | 9.98 | 21.00 | 1.00 | 1.00 |
| ##000000 | 9.98 | 21.00 | 1.00 | 1.00 |
Color blindness preview
Protanopia (red-blind)
#C6B24B
Deuteranopia (green-blind)
#C5B45B
Tritanopia (blue-blind)
#B9B0A4
Achromatopsia (no color)
#B3B3B3
Design tokens & code
CSS
--color: #afba55; /* rgb */ color: rgb(175, 186, 85); /* oklch */ color: oklch(75.9% 0.126 114.6);
Tailwind
colors: {
custom: {
50: '#c9ce88',
500: '#afba55',
950: '#000000',
},
}SCSS
$custom: #afba55; $custom-light: #c9ce88; $custom-dark: #000000;
JSON
{
"hex": "#afba55",
"rgb": {
"r": 175,
"g": 186,
"b": 85
},
"hsl": {
"h": 66.535,
"s": 42.259,
"l": 53.137
},
"oklch": {
"l": 0.75938,
"c": 0.12638,
"h": 114.6
},
"luminance": 0.44888
}Semantic roles & 50–950 ramp
primary
#AFBA55
secondary
#A4A0CB
accent
#56D263
background
#FCFCF8
surface
#F9F9F0
border
#D2D2CB
text
#13130C
muted
#82827D