#0C4A33#0C4A33
#0C4A33 is a dark, moderate teal. Relative luminance 0.052; OKLCH L 36.5% C 0.073 H 162.9°. Best body text is #FFFFFF at 10.28:1 contrast (WCAG AA passes).
Color values
| HEX | #0C4A33 |
|---|---|
| RGB | rgb(12, 74, 51) |
| HSL | hsl(158, 72%, 17%) |
| HSV | hsv(158, 84%, 29%) |
| CMYK | cmyk(83.8%, 0%, 31.1%, 71%) |
| CIE-LAB | lab(27.34, -25.39, 8.40) |
| CIE-LCH | lch(27.34, 26.74, 161.68°) |
| OKLab | oklab(36.48% -0.0694 0.0214) |
| OKLCH | oklch(36.48% 0.073 162.9) |
| XYZ | xyz(3.1976, 5.2144, 3.9693) |
| Luminance | 0.0522 (WCAG relative) |
| Temperature | neutral |
| Family | teal |
Closest named colors
Evergreen
#05472A
ΔE00 2.48
Pine Green
#0A481E
ΔE00 6.30
Dark Blue Green
#005249
ΔE00 6.80
Spruce
#0A5F38
ΔE00 7.79
Pine
#2B5D34
ΔE00 8.42
Hunter Green
#355E3B
ΔE00 8.53
Perceptual scales
Shades
Tints
Tones
OKLCH scale
Color harmonies
complementary
#0C4A33 #4A0C23
analogous
#0C4A14 #0C4A33 #0C424A
triadic
#0C4A33 #330C4A #4A330C
tetradic
#0C4A33 #140C4A #4A0C23 #424A0C
square
#0C4A33 #140C4A #4A0C23 #424A0C
split-complementary
#0C4A33 #4A0C42 #4A140C
monochromatic
#041A12 #041A12 #0C4A33 #157F57 #1DB37C
Accessibility & contrast
On white
10.28
#0C4A33 on #FFFFFF
AA ✓AA large ✓AAA ✓
On black
2.04
#0C4A33 on #000000
AA ✗AA large ✗AAA ✗
Best text color
#FFFFFF on #0C4A33
10.28:1 — WCAG AA (normal text) passes
Contrast matrix
| fg \ bg | ##0C4A33 | #FFFFFF | #000000 | ##FFFFFF |
|---|---|---|---|---|
| ##0C4A33 | 1.00 | 10.28 | 2.04 | 10.28 |
| #FFFFFF | 10.28 | 1.00 | 21.00 | 1.00 |
| #000000 | 2.04 | 21.00 | 1.00 | 21.00 |
| ##FFFFFF | 10.28 | 1.00 | 21.00 | 1.00 |
Color blindness preview
Protanopia (red-blind)
#494432
Deuteranopia (green-blind)
#413E35
Tritanopia (blue-blind)
#004A44
Achromatopsia (no color)
#414141
Design tokens & code
CSS
--color: #0c4a33; /* rgb */ color: rgb(12, 74, 51); /* oklch */ color: oklch(36.5% 0.073 162.9);
Tailwind
colors: {
custom: {
50: '#577d6a',
500: '#0c4a33',
950: '#000000',
},
}SCSS
$custom: #0c4a33; $custom-light: #577d6a; $custom-dark: #000000;
JSON
{
"hex": "#0c4a33",
"rgb": {
"r": 12,
"g": 74,
"b": 51
},
"hsl": {
"h": 157.742,
"s": 72.093,
"l": 16.863
},
"oklch": {
"l": 0.36475,
"c": 0.07267,
"h": 162.9
},
"luminance": 0.05215
}Semantic roles & 50–950 ramp
primary
#0C4A33
secondary
#862C4D
accent
#397CEF
background
#F5F7F6
surface
#E9EEEB
border
#C5C9C6
text
#030906
muted
#787B7A