#685C52#685C52
#685C52 is a mid, muted orange. Relative luminance 0.112; OKLCH L 48.3% C 0.022 H 62.1°. Best body text is #FFFFFF at 6.48:1 contrast (WCAG AA passes).
Color values
| HEX | #685C52 |
|---|---|
| RGB | rgb(104, 92, 82) |
| HSL | hsl(27, 12%, 36%) |
| HSV | hsv(27, 21%, 41%) |
| CMYK | cmyk(0%, 11.5%, 21.2%, 59.2%) |
| CIE-LAB | lab(39.93, 3.03, 7.53) |
| CIE-LCH | lch(39.93, 8.12, 68.04°) |
| OKLab | oklab(48.33% 0.0104 0.0195) |
| OKLCH | oklch(48.33% 0.022 62.1) |
| XYZ | xyz(11.0591, 11.2068, 9.5616) |
| Luminance | 0.1121 (WCAG relative) |
| Temperature | neutral |
| Family | orange |
Closest named colors
Umber
#635147
ΔE00 4.68
Walnut
#5C4A3D
ΔE00 6.69
Dimgray
#696969
ΔE00 8.40
Dark Taupe
#7F684E
ΔE00 8.57
Greyish Brown
#7A6A4F
ΔE00 8.71
Grey Brown
#7F7053
ΔE00 10.72
Perceptual scales
Shades
Tints
Tones
OKLCH scale
Color harmonies
complementary
#685C52 #525E68
analogous
#685253 #685C52 #686752
triadic
#685C52 #52685C #5C5268
tetradic
#685C52 #536852 #525E68 #675268
square
#685C52 #536852 #525E68 #675268
split-complementary
#685C52 #526867 #525368
monochromatic
#241F1C #463E37 #685C52 #8A7A6D #A6998E
Accessibility & contrast
On white
6.48
#685C52 on #FFFFFF
AA ✓AA large ✓AAA ✗
On black
3.24
#685C52 on #000000
AA ✗AA large ✓AAA ✗
Best text color
#FFFFFF on #685C52
6.48:1 — WCAG AA (normal text) passes
Contrast matrix
| fg \ bg | ##685C52 | #FFFFFF | #000000 | ##FFFFFF |
|---|---|---|---|---|
| ##685C52 | 1.00 | 6.48 | 3.24 | 6.48 |
| #FFFFFF | 6.48 | 1.00 | 21.00 | 1.00 |
| #000000 | 3.24 | 21.00 | 1.00 | 21.00 |
| ##FFFFFF | 6.48 | 1.00 | 21.00 | 1.00 |
Color blindness preview
Protanopia (red-blind)
#605D51
Deuteranopia (green-blind)
#635F52
Tritanopia (blue-blind)
#6C5A59
Achromatopsia (no color)
#5E5E5E
Design tokens & code
CSS
--color: #685c52; /* rgb */ color: rgb(104, 92, 82); /* oklch */ color: oklch(48.3% 0.022 62.1);
Tailwind
colors: {
custom: {
50: '#938a82',
500: '#685c52',
950: '#000000',
},
}SCSS
$custom: #685c52; $custom-light: #938a82; $custom-dark: #000000;
JSON
{
"hex": "#685c52",
"rgb": {
"r": 104,
"g": 92,
"b": 82
},
"hsl": {
"h": 27.273,
"s": 11.828,
"l": 36.471
},
"oklch": {
"l": 0.48328,
"c": 0.0221,
"h": 62.1
},
"luminance": 0.11207
}Semantic roles & 50–950 ramp
primary
#685C52
secondary
#818C95
accent
#97B573
background
#F9F8F7
surface
#F1F0EE
border
#CBCBC9
text
#0D0B0A
muted
#7E7C7C