#12603F#12603F
#12603F is a dark, moderate teal. Relative luminance 0.089; OKLCH L 43.5% C 0.091 H 159.7°. Best body text is #FFFFFF at 7.58:1 contrast (WCAG AA passes).
Color values
| HEX | #12603F |
|---|---|
| RGB | rgb(18, 96, 63) |
| HSL | hsl(155, 68%, 22%) |
| HSV | hsv(155, 81%, 38%) |
| CMYK | cmyk(81.3%, 0%, 34.4%, 62.4%) |
| CIE-LAB | lab(35.70, -31.47, 12.48) |
| CIE-LCH | lch(35.70, 33.86, 158.36°) |
| OKLab | oklab(43.48% -0.0855 0.0316) |
| OKLCH | oklch(43.48% 0.091 159.7) |
| XYZ | xyz(5.3290, 8.8526, 6.1295) |
| Luminance | 0.0885 (WCAG relative) |
| Temperature | neutral |
| Family | teal |
Closest named colors
Spruce
#0A5F38
ΔE00 1.89
Pine
#2B5D34
ΔE00 4.52
Hunter Green
#355E3B
ΔE00 5.05
Forest Green
#2D5A27
ΔE00 7.48
Evergreen
#05472A
ΔE00 7.88
Dark Green Blue
#1F6357
ΔE00 7.99
Perceptual scales
Shades
Tints
Tones
OKLCH scale
Color harmonies
complementary
#12603F #601233
analogous
#126018 #12603F #125A60
triadic
#12603F #3F1260 #603F12
tetradic
#12603F #181260 #601233 #5A6012
square
#12603F #181260 #601233 #5A6012
split-complementary
#12603F #60125A #601812
monochromatic
#051A11 #082C1D #12603F #1C9461 #25C783
Accessibility & contrast
On white
7.58
#12603F on #FFFFFF
AA ✓AA large ✓AAA ✓
On black
2.77
#12603F on #000000
AA ✗AA large ✗AAA ✗
Best text color
#FFFFFF on #12603F
7.58:1 — WCAG AA (normal text) passes
Contrast matrix
| fg \ bg | ##12603F | #FFFFFF | #000000 | ##FFFFFF |
|---|---|---|---|---|
| ##12603F | 1.00 | 7.58 | 2.77 | 7.58 |
| #FFFFFF | 7.58 | 1.00 | 21.00 | 1.00 |
| #000000 | 2.77 | 21.00 | 1.00 | 21.00 |
| ##FFFFFF | 7.58 | 1.00 | 21.00 | 1.00 |
Color blindness preview
Protanopia (red-blind)
#5F583D
Deuteranopia (green-blind)
#555141
Tritanopia (blue-blind)
#006057
Achromatopsia (no color)
#545454
Design tokens & code
CSS
--color: #12603f; /* rgb */ color: rgb(18, 96, 63); /* oklch */ color: oklch(43.5% 0.091 159.7);
Tailwind
colors: {
custom: {
50: '#5e8e74',
500: '#12603f',
950: '#000000',
},
}SCSS
$custom: #12603f; $custom-light: #5e8e74; $custom-dark: #000000;
JSON
{
"hex": "#12603f",
"rgb": {
"r": 18,
"g": 96,
"b": 63
},
"hsl": {
"h": 154.615,
"s": 68.421,
"l": 22.353
},
"oklch": {
"l": 0.43481,
"c": 0.09115,
"h": 159.7
},
"luminance": 0.08853
}Semantic roles & 50–950 ramp
primary
#12603F
secondary
#98365F
accent
#3D86EB
background
#F5F8F7
surface
#EAF0ED
border
#C6CBC8
text
#050C08
muted
#797D7B