#1F686A#1F686A
#1F686A is a mid, moderate teal. Relative luminance 0.112; OKLCH L 47.5% C 0.070 H 197.7°. Best body text is #FFFFFF at 6.47:1 contrast (WCAG AA passes).
Color values
| HEX | #1F686A |
|---|---|
| RGB | rgb(31, 104, 106) |
| HSL | hsl(182, 55%, 27%) |
| HSV | hsv(182, 71%, 42%) |
| CMYK | cmyk(70.8%, 1.9%, 0%, 58.4%) |
| CIE-LAB | lab(39.97, -21.07, -7.65) |
| CIE-LCH | lch(39.97, 22.41, 199.95°) |
| OKLab | oklab(47.45% -0.0664 -0.0212) |
| OKLCH | oklch(47.45% 0.07 197.7) |
| XYZ | xyz(8.1158, 11.2316, 15.3731) |
| Luminance | 0.1123 (WCAG relative) |
| Temperature | cool |
| Family | teal |
Closest named colors
Dark Aqua
#05696B
ΔE00 1.59
Deep Turquoise
#017374
ΔE00 4.22
Dark Aquamarine
#017371
ΔE00 4.68
Dark Turquoise
#045C5A
ΔE00 4.85
Petrol
#005F6A
ΔE00 5.05
Deep Aqua
#08787F
ΔE00 5.97
Perceptual scales
Shades
Tints
Tones
OKLCH scale
Color harmonies
complementary
#1F686A #6A211F
analogous
#1F6A47 #1F686A #1F436A
triadic
#1F686A #6A1F68 #686A1F
tetradic
#1F686A #471F6A #6A211F #436A1F
square
#1F686A #471F6A #6A211F #436A1F
split-complementary
#1F686A #6A1F43 #6A471F
monochromatic
#071718 #113A3B #1F686A #2D9699 #3DC3C6
Accessibility & contrast
On white
6.47
#1F686A on #FFFFFF
AA ✓AA large ✓AAA ✗
On black
3.25
#1F686A on #000000
AA ✗AA large ✓AAA ✗
Best text color
#FFFFFF on #1F686A
6.47:1 — WCAG AA (normal text) passes
Contrast matrix
| fg \ bg | ##1F686A | #FFFFFF | #000000 | ##FFFFFF |
|---|---|---|---|---|
| ##1F686A | 1.00 | 6.47 | 3.25 | 6.47 |
| #FFFFFF | 6.47 | 1.00 | 21.00 | 1.00 |
| #000000 | 3.25 | 21.00 | 1.00 | 21.00 |
| ##FFFFFF | 6.47 | 1.00 | 21.00 | 1.00 |
Color blindness preview
Protanopia (red-blind)
#61636A
Deuteranopia (green-blind)
#555B6A
Tritanopia (blue-blind)
#006C68
Achromatopsia (no color)
#5E5E5E
Design tokens & code
CSS
--color: #1f686a; /* rgb */ color: rgb(31, 104, 106); /* oklch */ color: oklch(47.5% 0.070 197.7);
Tailwind
colors: {
custom: {
50: '#679394',
500: '#1f686a',
950: '#000000',
},
}SCSS
$custom: #1f686a; $custom-light: #679394; $custom-dark: #000000;
JSON
{
"hex": "#1f686a",
"rgb": {
"r": 31,
"g": 104,
"b": 106
},
"hsl": {
"h": 181.6,
"s": 54.745,
"l": 26.863
},
"oklch": {
"l": 0.47454,
"c": 0.06975,
"h": 197.7
},
"luminance": 0.11233
}Semantic roles & 50–950 ramp
primary
#1F686A
secondary
#9E4947
accent
#4E4ADE
background
#F6F9F9
surface
#EBF1F1
border
#C6CBCB
text
#070D0D
muted
#7A7E7E