#0C3F3F#0C3F3F
#0C3F3F is a dark, muted teal. Relative luminance 0.040; OKLCH L 33.6% C 0.051 H 195.0°. Best body text is #FFFFFF at 11.68:1 contrast (WCAG AA passes).
Color values
| HEX | #0C3F3F |
|---|---|
| RGB | rgb(12, 63, 63) |
| HSL | hsl(180, 68%, 15%) |
| HSV | hsv(180, 81%, 25%) |
| CMYK | cmyk(81%, 0%, 0%, 75.3%) |
| CIE-LAB | lab(23.64, -15.98, -4.78) |
| CIE-LCH | lch(23.64, 16.68, 196.65°) |
| OKLab | oklab(33.58% -0.0496 -0.0133) |
| OKLCH | oklch(33.58% 0.051 195) |
| XYZ | xyz(2.8259, 3.9917, 5.3232) |
| Luminance | 0.0399 (WCAG relative) |
| Temperature | cool |
| Family | teal |
Closest named colors
Dark Teal
#014D4E
ΔE00 4.75
Darkslategray
#2F4F4F
ΔE00 6.57
Deep Teal
#00555A
ΔE00 7.48
Dark Blue Green
#005249
ΔE00 7.91
Dark Turquoise
#045C5A
ΔE00 9.62
Petrol
#005F6A
ΔE00 11.35
Perceptual scales
Shades
Tints
Tones
OKLCH scale
Color harmonies
complementary
#0C3F3F #3F0C0C
analogous
#0C3F26 #0C3F3F #0C263F
triadic
#0C3F3F #3F0C3F #3F3F0C
tetradic
#0C3F3F #260C3F #3F0C0C #263F0C
square
#0C3F3F #260C3F #3F0C0C #263F0C
split-complementary
#0C3F3F #3F0C26 #3F260C
monochromatic
#051A1A #051A1A #0C3F3F #167272 #20A6A6
Accessibility & contrast
On white
11.68
#0C3F3F on #FFFFFF
AA ✓AA large ✓AAA ✓
On black
1.80
#0C3F3F on #000000
AA ✗AA large ✗AAA ✗
Best text color
#FFFFFF on #0C3F3F
11.68:1 — WCAG AA (normal text) passes
Contrast matrix
| fg \ bg | ##0C3F3F | #FFFFFF | #000000 | ##FFFFFF |
|---|---|---|---|---|
| ##0C3F3F | 1.00 | 11.68 | 1.80 | 11.68 |
| #FFFFFF | 11.68 | 1.00 | 21.00 | 1.00 |
| #000000 | 1.80 | 21.00 | 1.00 | 21.00 |
| ##FFFFFF | 11.68 | 1.00 | 21.00 | 1.00 |
Color blindness preview
Protanopia (red-blind)
#3A3B3F
Deuteranopia (green-blind)
#33363F
Tritanopia (blue-blind)
#00413F
Achromatopsia (no color)
#383838
Design tokens & code
CSS
--color: #0c3f3f; /* rgb */ color: rgb(12, 63, 63); /* oklch */ color: oklch(33.6% 0.051 195.0);
Tailwind
colors: {
custom: {
50: '#557474',
500: '#0c3f3f',
950: '#000000',
},
}SCSS
$custom: #0c3f3f; $custom-light: #557474; $custom-dark: #000000;
JSON
{
"hex": "#0c3f3f",
"rgb": {
"r": 12,
"g": 63,
"b": 63
},
"hsl": {
"h": 180,
"s": 68,
"l": 14.706
},
"oklch": {
"l": 0.33577,
"c": 0.05139,
"h": 195
},
"luminance": 0.03992
}Semantic roles & 50–950 ramp
primary
#0C3F3F
secondary
#7B2C2C
accent
#3D3DEB
background
#F5F7F7
surface
#E9EDED
border
#C5C8C8
text
#030808
muted
#787B7B