#4A697E#4A697E
#4A697E is a mid, muted cyan. Relative luminance 0.131; OKLCH L 50.5% C 0.049 H 238.6°. Best body text is #FFFFFF at 5.81:1 contrast (WCAG AA passes).
Color values
| HEX | #4A697E |
|---|---|
| RGB | rgb(74, 105, 126) |
| HSL | hsl(204, 26%, 39%) |
| HSV | hsv(204, 41%, 49%) |
| CMYK | cmyk(41.3%, 16.7%, 0%, 50.6%) |
| CIE-LAB | lab(42.86, -5.41, -15.24) |
| CIE-LCH | lch(42.86, 16.17, 250.46°) |
| OKLab | oklab(50.52% -0.0256 -0.0421) |
| OKLCH | oklch(50.52% 0.049 238.6) |
| XYZ | xyz(11.6403, 13.0647, 21.6430) |
| Luminance | 0.1306 (WCAG relative) |
| Temperature | cool |
| Family | cyan |
Closest named colors
Slate
#516572
ΔE00 3.68
Metallic Blue
#4F738E
ΔE00 4.22
Ugly Blue
#31668A
ΔE00 5.09
Cadet Blue
#4E7496
ΔE00 5.99
Slate Grey
#59656D
ΔE00 6.51
Denim (survey)
#3B638C
ΔE00 6.58
Perceptual scales
Shades
Tints
Tones
OKLCH scale
Color harmonies
complementary
#4A697E #7E5F4A
analogous
#4A7E79 #4A697E #4A4F7E
triadic
#4A697E #7E4A69 #697E4A
tetradic
#4A697E #794A7E #7E5F4A #4F7E4A
square
#4A697E #794A7E #7E5F4A #4F7E4A
split-complementary
#4A697E #7E4A4F #7E794A
monochromatic
#1D2931 #334957 #4A697E #6289A3 #89A6BA
Accessibility & contrast
On white
5.81
#4A697E on #FFFFFF
AA ✓AA large ✓AAA ✗
On black
3.61
#4A697E on #000000
AA ✗AA large ✓AAA ✗
Best text color
#FFFFFF on #4A697E
5.81:1 — WCAG AA (normal text) passes
Contrast matrix
| fg \ bg | ##4A697E | #FFFFFF | #000000 | ##FFFFFF |
|---|---|---|---|---|
| ##4A697E | 1.00 | 5.81 | 3.61 | 5.81 |
| #FFFFFF | 5.81 | 1.00 | 21.00 | 1.00 |
| #000000 | 3.61 | 21.00 | 1.00 | 21.00 |
| ##FFFFFF | 5.81 | 1.00 | 21.00 | 1.00 |
Color blindness preview
Protanopia (red-blind)
#60687F
Deuteranopia (green-blind)
#59637E
Tritanopia (blue-blind)
#376E70
Achromatopsia (no color)
#656565
Design tokens & code
CSS
--color: #4a697e; /* rgb */ color: rgb(74, 105, 126); /* oklch */ color: oklch(50.5% 0.049 238.6);
Tailwind
colors: {
custom: {
50: '#7f93a3',
500: '#4a697e',
950: '#000000',
},
}SCSS
$custom: #4a697e; $custom-light: #7f93a3; $custom-dark: #000000;
JSON
{
"hex": "#4a697e",
"rgb": {
"r": 74,
"g": 105,
"b": 126
},
"hsl": {
"h": 204.231,
"s": 26,
"l": 39.216
},
"oklch": {
"l": 0.50515,
"c": 0.04926,
"h": 238.6
},
"luminance": 0.13065
}Semantic roles & 50–950 ramp
primary
#4A697E
secondary
#A68E7E
accent
#8B65C2
background
#F7F9FA
surface
#EEF1F3
border
#C9CBCD
text
#0A0D0F
muted
#7C7E7F