#51300C#51300C
#51300C is a dark, moderate orange. Relative luminance 0.039; OKLCH L 34.3% C 0.068 H 63.6°. Best body text is #FFFFFF at 11.81:1 contrast (WCAG AA passes).
Color values
| HEX | #51300C |
|---|---|
| RGB | rgb(81, 48, 12) |
| HSL | hsl(31, 74%, 18%) |
| HSV | hsv(31, 85%, 32%) |
| CMYK | cmyk(0%, 40.7%, 85.2%, 68.2%) |
| CIE-LAB | lab(23.31, 11.69, 27.87) |
| CIE-LCH | lch(23.31, 30.22, 67.24°) |
| OKLab | oklab(34.31% 0.0303 0.061) |
| OKLCH | oklch(34.31% 0.068 63.6) |
| XYZ | xyz(4.5170, 3.8902, 0.8608) |
| Luminance | 0.0389 (WCAG relative) |
| Temperature | warm |
| Family | orange |
Closest named colors
Brown (survey)
#653700
ΔE00 5.70
Chocolate (survey)
#3D1C02
ΔE00 7.74
Dark Brown
#341C02
ΔE00 8.34
Espresso
#4B382A
ΔE00 8.71
Chocolate Brown
#411900
ΔE00 9.09
Mud Brown
#60460F
ΔE00 9.11
Perceptual scales
Shades
Tints
Tones
OKLCH scale
Color harmonies
complementary
#51300C #0C2D51
analogous
#510D0C #51300C #4F510C
triadic
#51300C #0C5130 #300C51
tetradic
#51300C #0C510D #0C2D51 #510C4F
square
#51300C #0C510D #0C2D51 #510C4F
split-complementary
#51300C #0C4F51 #0D0C51
monochromatic
#1B1004 #1C1004 #51300C #865014 #BC6F1C
Accessibility & contrast
On white
11.81
#51300C on #FFFFFF
AA ✓AA large ✓AAA ✓
On black
1.78
#51300C on #000000
AA ✗AA large ✗AAA ✗
Best text color
#FFFFFF on #51300C
11.81:1 — WCAG AA (normal text) passes
Contrast matrix
| fg \ bg | ##51300C | #FFFFFF | #000000 | ##FFFFFF |
|---|---|---|---|---|
| ##51300C | 1.00 | 11.81 | 1.78 | 11.81 |
| #FFFFFF | 11.81 | 1.00 | 21.00 | 1.00 |
| #000000 | 1.78 | 21.00 | 1.00 | 21.00 |
| ##FFFFFF | 11.81 | 1.00 | 21.00 | 1.00 |
Color blindness preview
Protanopia (red-blind)
#3A3307
Deuteranopia (green-blind)
#423B0D
Tritanopia (blue-blind)
#592829
Achromatopsia (no color)
#383838
Design tokens & code
CSS
--color: #51300c; /* rgb */ color: rgb(81, 48, 12); /* oklch */ color: oklch(34.3% 0.068 63.6);
Tailwind
colors: {
custom: {
50: '#86684d',
500: '#51300c',
950: '#000000',
},
}SCSS
$custom: #51300c; $custom-light: #86684d; $custom-dark: #000000;
JSON
{
"hex": "#51300c",
"rgb": {
"r": 81,
"g": 48,
"b": 12
},
"hsl": {
"h": 31.304,
"s": 74.194,
"l": 18.235
},
"oklch": {
"l": 0.34314,
"c": 0.06812,
"h": 63.6
},
"luminance": 0.0389
}Semantic roles & 50–950 ramp
primary
#51300C
secondary
#2C5A8C
accent
#90F137
background
#F8F6F4
surface
#F0EBE7
border
#CBC6C3
text
#0C0601
muted
#7D7A77