#3A585F#3A585F
#3A585F is a dark, muted cyan. Relative luminance 0.087; OKLCH L 44.0% C 0.037 H 213.9°. Best body text is #FFFFFF at 7.66:1 contrast (WCAG AA passes).
Color values
| HEX | #3A585F |
|---|---|
| RGB | rgb(58, 88, 95) |
| HSL | hsl(191, 24%, 30%) |
| HSV | hsv(191, 39%, 37%) |
| CMYK | cmyk(38.9%, 7.4%, 0%, 62.7%) |
| CIE-LAB | lab(35.41, -9.06, -7.57) |
| CIE-LCH | lch(35.41, 11.81, 219.87°) |
| OKLab | oklab(43.97% -0.0309 -0.0207) |
| OKLCH | oklch(43.97% 0.037 213.9) |
| XYZ | xyz(7.2995, 8.7048, 12.1198) |
| Luminance | 0.0871 (WCAG relative) |
| Temperature | cool |
| Family | cyan |
Closest named colors
Darkslategray
#2F4F4F
ΔE00 5.34
Gunmetal (survey)
#536267
ΔE00 6.49
Slate
#516572
ΔE00 7.70
Petrol
#005F6A
ΔE00 7.72
Charcoal
#36454F
ΔE00 8.30
Deep Teal
#00555A
ΔE00 8.31
Perceptual scales
Shades
Tints
Tones
OKLCH scale
Color harmonies
complementary
#3A585F #5F413A
analogous
#3A5F53 #3A585F #3A465F
triadic
#3A585F #5F3A58 #585F3A
tetradic
#3A585F #533A5F #5F413A #465F3A
square
#3A585F #533A5F #5F413A #465F3A
split-complementary
#3A585F #5F3A46 #5F533A
monochromatic
#0C1213 #233539 #3A585F #517B85 #6D9BA6
Accessibility & contrast
On white
7.66
#3A585F on #FFFFFF
AA ✓AA large ✓AAA ✓
On black
2.74
#3A585F on #000000
AA ✗AA large ✗AAA ✗
Best text color
#FFFFFF on #3A585F
7.66:1 — WCAG AA (normal text) passes
Contrast matrix
| fg \ bg | ##3A585F | #FFFFFF | #000000 | ##FFFFFF |
|---|---|---|---|---|
| ##3A585F | 1.00 | 7.66 | 2.74 | 7.66 |
| #FFFFFF | 7.66 | 1.00 | 21.00 | 1.00 |
| #000000 | 2.74 | 21.00 | 1.00 | 21.00 |
| ##FFFFFF | 7.66 | 1.00 | 21.00 | 1.00 |
Color blindness preview
Protanopia (red-blind)
#53565F
Deuteranopia (green-blind)
#4D515F
Tritanopia (blue-blind)
#2C5B5A
Achromatopsia (no color)
#535353
Design tokens & code
CSS
--color: #3a585f; /* rgb */ color: rgb(58, 88, 95); /* oklch */ color: oklch(44.0% 0.037 213.9);
Tailwind
colors: {
custom: {
50: '#72878c',
500: '#3a585f',
950: '#000000',
},
}SCSS
$custom: #3a585f; $custom-light: #72878c; $custom-dark: #000000;
JSON
{
"hex": "#3a585f",
"rgb": {
"r": 58,
"g": 88,
"b": 95
},
"hsl": {
"h": 191.351,
"s": 24.183,
"l": 30
},
"oklch": {
"l": 0.43968,
"c": 0.0372,
"h": 213.9
},
"luminance": 0.08705
}Semantic roles & 50–950 ramp
primary
#3A585F
secondary
#8F6E66
accent
#7867C1
background
#F7F8F8
surface
#EDEFF0
border
#C8CACB
text
#080B0C
muted
#7B7C7D