#D18957#D18957
#D18957 is a light, moderate orange. Relative luminance 0.321; OKLCH L 69.3% C 0.110 H 54.6°. Best body text is #000000 at 7.43:1 contrast (WCAG AA passes).
Color values
| HEX | #D18957 |
|---|---|
| RGB | rgb(209, 137, 87) |
| HSL | hsl(25, 57%, 58%) |
| HSV | hsv(25, 58%, 82%) |
| CMYK | cmyk(0%, 34.4%, 58.4%, 18%) |
| CIE-LAB | lab(63.46, 22.47, 37.83) |
| CIE-LCH | lch(63.46, 44.00, 59.29°) |
| OKLab | oklab(69.33% 0.0638 0.0898) |
| OKLCH | oklch(69.33% 0.11 54.6) |
| XYZ | xyz(36.9629, 32.1380, 13.2715) |
| Luminance | 0.3214 (WCAG relative) |
| Temperature | warm |
| Family | orange |
Closest named colors
Peru
#CD853F
ΔE00 4.93
Dull Orange
#D8863B
ΔE00 5.04
Bronze
#CD7F32
ΔE00 6.16
Caramel
#C68E4E
ΔE00 6.48
Faded Orange
#F0944D
ΔE00 6.71
Dusty Orange
#F0833A
ΔE00 6.98
Perceptual scales
Shades
Tints
Tones
OKLCH scale
Color harmonies
complementary
#D18957 #579FD1
analogous
#D15762 #D18957 #D1C657
triadic
#D18957 #57D189 #8957D1
tetradic
#D18957 #62D157 #579FD1 #C657D1
square
#D18957 #62D157 #579FD1 #C657D1
split-complementary
#D18957 #57D1C6 #5762D1
monochromatic
#884E25 #B86932 #D18957 #DEAB87 #EBCCB7
Accessibility & contrast
On white
2.83
#D18957 on #FFFFFF
AA ✗AA large ✗AAA ✗
On black
7.43
#D18957 on #000000
AA ✓AA large ✓AAA ✓
Best text color
#000000 on #D18957
7.43:1 — WCAG AA (normal text) passes
Contrast matrix
| fg \ bg | ##D18957 | #FFFFFF | #000000 | ##000000 |
|---|---|---|---|---|
| ##D18957 | 1.00 | 2.83 | 7.43 | 7.43 |
| #FFFFFF | 2.83 | 1.00 | 21.00 | 21.00 |
| #000000 | 7.43 | 21.00 | 1.00 | 1.00 |
| ##000000 | 7.43 | 21.00 | 1.00 | 1.00 |
Color blindness preview
Protanopia (red-blind)
#9E9053
Deuteranopia (green-blind)
#AFA057
Tritanopia (blue-blind)
#E27B7D
Achromatopsia (no color)
#9A9A9A
Design tokens & code
CSS
--color: #d18957; /* rgb */ color: rgb(209, 137, 87); /* oklch */ color: oklch(69.3% 0.110 54.6);
Tailwind
colors: {
custom: {
50: '#e3ab87',
500: '#d18957',
950: '#000000',
},
}SCSS
$custom: #d18957; $custom-light: #e3ab87; $custom-dark: #000000;
JSON
{
"hex": "#d18957",
"rgb": {
"r": 209,
"g": 137,
"b": 87
},
"hsl": {
"h": 24.59,
"s": 57.009,
"l": 58.039
},
"oklch": {
"l": 0.69332,
"c": 0.11013,
"h": 54.6
},
"luminance": 0.32135
}Semantic roles & 50–950 ramp
primary
#D18957
secondary
#AAC6DA
accent
#A2E048
background
#FEFAF8
surface
#FDF4EF
border
#D5CECA
text
#16100B
muted
#847F7C