#618797#618797
#618797 is a mid, muted cyan. Relative luminance 0.221; OKLCH L 60.1% C 0.049 H 225.9°. Best body text is #000000 at 5.42:1 contrast (WCAG AA passes).
Color values
| HEX | #618797 |
|---|---|
| RGB | rgb(97, 135, 151) |
| HSL | hsl(198, 22%, 49%) |
| HSV | hsv(198, 36%, 59%) |
| CMYK | cmyk(35.8%, 10.6%, 0%, 40.8%) |
| CIE-LAB | lab(54.14, -9.05, -12.78) |
| CIE-LCH | lch(54.14, 15.65, 234.70°) |
| OKLab | oklab(60.1% -0.0339 -0.035) |
| OKLCH | oklch(60.1% 0.049 225.9) |
| XYZ | xyz(19.1778, 22.1026, 32.5279) |
| Luminance | 0.2210 (WCAG relative) |
| Temperature | cool |
| Family | cyan |
Closest named colors
Bluish Grey
#748B97
ΔE00 4.46
Grey Blue
#647D8E
ΔE00 5.04
Steel Grey
#6F828A
ΔE00 5.28
Dirty Blue
#3F829D
ΔE00 5.59
Greyish Blue
#5E819D
ΔE00 5.90
Steel
#738595
ΔE00 6.23
Perceptual scales
Shades
Tints
Tones
OKLCH scale
Color harmonies
complementary
#618797 #977161
analogous
#61978C #618797 #616C97
triadic
#618797 #976187 #879761
tetradic
#618797 #8C6197 #977161 #6C9761
square
#618797 #8C6197 #977161 #6C9761
split-complementary
#618797 #97616C #978C61
monochromatic
#31444C #496672 #618797 #85A4B0 #AABFC8
Accessibility & contrast
On white
3.87
#618797 on #FFFFFF
AA ✗AA large ✓AAA ✗
On black
5.42
#618797 on #000000
AA ✓AA large ✓AAA ✗
Best text color
#000000 on #618797
5.42:1 — WCAG AA (normal text) passes
Contrast matrix
| fg \ bg | ##618797 | #FFFFFF | #000000 | ##000000 |
|---|---|---|---|---|
| ##618797 | 1.00 | 3.87 | 5.42 | 5.42 |
| #FFFFFF | 3.87 | 1.00 | 21.00 | 21.00 |
| #000000 | 5.42 | 21.00 | 1.00 | 1.00 |
| ##000000 | 5.42 | 21.00 | 1.00 | 1.00 |
Color blindness preview
Protanopia (red-blind)
#7E8598
Deuteranopia (green-blind)
#767F97
Tritanopia (blue-blind)
#4E8C8C
Achromatopsia (no color)
#818181
Design tokens & code
CSS
--color: #618797; /* rgb */ color: rgb(97, 135, 151); /* oklch */ color: oklch(60.1% 0.049 225.9);
Tailwind
colors: {
custom: {
50: '#90aab5',
500: '#618797',
950: '#000000',
},
}SCSS
$custom: #618797; $custom-light: #90aab5; $custom-dark: #000000;
JSON
{
"hex": "#618797",
"rgb": {
"r": 97,
"g": 135,
"b": 151
},
"hsl": {
"h": 197.778,
"s": 21.774,
"l": 48.627
},
"oklch": {
"l": 0.60104,
"c": 0.04877,
"h": 225.9
},
"luminance": 0.22104
}Semantic roles & 50–950 ramp
primary
#618797
secondary
#B7A59D
accent
#8369BE
background
#F8FAFB
surface
#F0F4F6
border
#CBCED0
text
#0D1011
muted
#7D7F80