#554E2C#554E2C
#554E2C is a dark, muted yellow. Relative luminance 0.076; OKLCH L 42.2% C 0.052 H 98.0°. Best body text is #FFFFFF at 8.36:1 contrast (WCAG AA passes).
Color values
| HEX | #554E2C |
|---|---|
| RGB | rgb(85, 78, 44) |
| HSL | hsl(50, 32%, 25%) |
| HSV | hsv(50, 48%, 33%) |
| CMYK | cmyk(0%, 8.2%, 48.2%, 66.7%) |
| CIE-LAB | lab(33.05, -2.60, 21.12) |
| CIE-LCH | lch(33.05, 21.28, 97.02°) |
| OKLab | oklab(42.2% -0.0072 0.0511) |
| OKLCH | oklch(42.2% 0.052 98) |
| XYZ | xyz(6.9255, 7.5622, 3.4772) |
| Luminance | 0.0756 (WCAG relative) |
| Temperature | warm |
| Family | yellow |
Closest named colors
Green Brown
#544E03
ΔE00 7.95
Mud Brown
#60460F
ΔE00 9.10
Olive Brown
#645403
ΔE00 9.49
Dark Olive
#373E02
ΔE00 9.96
Greenish Brown
#696112
ΔE00 10.89
Dark Olive Green
#3C4D03
ΔE00 11.05
Perceptual scales
Shades
Tints
Tones
OKLCH scale
Color harmonies
complementary
#554E2C #2C3355
analogous
#55392C #554E2C #47552C
triadic
#554E2C #2C554E #4E2C55
tetradic
#554E2C #2C5539 #2C3355 #552C47
square
#554E2C #2C5539 #2C3355 #552C47
split-complementary
#554E2C #2C4755 #392C55
monochromatic
#14130A #2D2917 #554E2C #7D7341 #A69856
Accessibility & contrast
On white
8.36
#554E2C on #FFFFFF
AA ✓AA large ✓AAA ✓
On black
2.51
#554E2C on #000000
AA ✗AA large ✗AAA ✗
Best text color
#FFFFFF on #554E2C
8.36:1 — WCAG AA (normal text) passes
Contrast matrix
| fg \ bg | ##554E2C | #FFFFFF | #000000 | ##FFFFFF |
|---|---|---|---|---|
| ##554E2C | 1.00 | 8.36 | 2.51 | 8.36 |
| #FFFFFF | 8.36 | 1.00 | 21.00 | 1.00 |
| #000000 | 2.51 | 21.00 | 1.00 | 21.00 |
| ##FFFFFF | 8.36 | 1.00 | 21.00 | 1.00 |
Color blindness preview
Protanopia (red-blind)
#544C29
Deuteranopia (green-blind)
#564F2D
Tritanopia (blue-blind)
#5B4946
Achromatopsia (no color)
#4E4E4E
Design tokens & code
CSS
--color: #554e2c; /* rgb */ color: rgb(85, 78, 44); /* oklch */ color: oklch(42.2% 0.052 98.0);
Tailwind
colors: {
custom: {
50: '#867f66',
500: '#554e2c',
950: '#000000',
},
}SCSS
$custom: #554e2c; $custom-light: #867f66; $custom-dark: #000000;
JSON
{
"hex": "#554e2c",
"rgb": {
"r": 85,
"g": 78,
"b": 44
},
"hsl": {
"h": 49.756,
"s": 31.783,
"l": 25.294
},
"oklch": {
"l": 0.42199,
"c": 0.05162,
"h": 98
},
"luminance": 0.07562
}Semantic roles & 50–950 ramp
primary
#554E2C
secondary
#565E87
accent
#72C860
background
#F8F7F6
surface
#EFEEEB
border
#CAC9C6
text
#0B0A06
muted
#7C7C7A