#D38155#D38155
#D38155 is a light, moderate orange. Relative luminance 0.302; OKLCH L 68.1% C 0.118 H 48.2°. Best body text is #000000 at 7.04:1 contrast (WCAG AA passes).
Color values
| HEX | #D38155 |
|---|---|
| RGB | rgb(211, 129, 85) |
| HSL | hsl(21, 59%, 58%) |
| HSV | hsv(21, 60%, 83%) |
| CMYK | cmyk(0%, 38.9%, 59.7%, 17.3%) |
| CIE-LAB | lab(61.83, 27.46, 36.97) |
| CIE-LCH | lch(61.83, 46.05, 53.39°) |
| OKLab | oklab(68.12% 0.0784 0.0876) |
| OKLCH | oklch(68.12% 0.118 48.2) |
| XYZ | xyz(36.3565, 30.2087, 12.5087) |
| Luminance | 0.3020 (WCAG relative) |
| Temperature | warm |
| Family | orange |
Closest named colors
Dark Peach
#DE7E5D
ΔE00 4.82
Terracotta
#C96F4A
ΔE00 5.76
Dusty Orange
#F0833A
ΔE00 7.06
Adobe
#BD6C48
ΔE00 7.39
Dull Orange
#D8863B
ΔE00 7.44
Terracota
#CB6843
ΔE00 7.55
Perceptual scales
Shades
Tints
Tones
OKLCH scale
Color harmonies
complementary
#D38155 #55A7D3
analogous
#D35568 #D38155 #D3C055
triadic
#D38155 #55D381 #8155D3
tetradic
#D38155 #68D355 #55A7D3 #C055D3
square
#D38155 #68D355 #55A7D3 #C055D3
split-complementary
#D38155 #55D3C0 #5568D3
monochromatic
#8A4724 #BB6130 #D38155 #E0A586 #ECC9B6
Accessibility & contrast
On white
2.98
#D38155 on #FFFFFF
AA ✗AA large ✗AAA ✗
On black
7.04
#D38155 on #000000
AA ✓AA large ✓AAA ✓
Best text color
#000000 on #D38155
7.04:1 — WCAG AA (normal text) passes
Contrast matrix
| fg \ bg | ##D38155 | #FFFFFF | #000000 | ##000000 |
|---|---|---|---|---|
| ##D38155 | 1.00 | 2.98 | 7.04 | 7.04 |
| #FFFFFF | 2.98 | 1.00 | 21.00 | 21.00 |
| #000000 | 7.04 | 21.00 | 1.00 | 1.00 |
| ##000000 | 7.04 | 21.00 | 1.00 | 1.00 |
Color blindness preview
Protanopia (red-blind)
#978B51
Deuteranopia (green-blind)
#AB9C54
Tritanopia (blue-blind)
#E57176
Achromatopsia (no color)
#959595
Design tokens & code
CSS
--color: #d38155; /* rgb */ color: rgb(211, 129, 85); /* oklch */ color: oklch(68.1% 0.118 48.2);
Tailwind
colors: {
custom: {
50: '#e5a686',
500: '#d38155',
950: '#000000',
},
}SCSS
$custom: #d38155; $custom-light: #e5a686; $custom-dark: #000000;
JSON
{
"hex": "#d38155",
"rgb": {
"r": 211,
"g": 129,
"b": 85
},
"hsl": {
"h": 20.952,
"s": 58.879,
"l": 58.039
},
"oklch": {
"l": 0.68123,
"c": 0.11756,
"h": 48.2
},
"luminance": 0.30205
}Semantic roles & 50–950 ramp
primary
#D38155
secondary
#A9C9DB
accent
#ABE246
background
#FEFAF8
surface
#FDF4EF
border
#D5CECA
text
#160F0B
muted
#847F7C