#5A899B#5A899B
#5A899B is a mid, muted cyan. Relative luminance 0.224; OKLCH L 60.3% C 0.058 H 224.1°. Best body text is #000000 at 5.49:1 contrast (WCAG AA passes).
Color values
| HEX | #5A899B |
|---|---|
| RGB | rgb(90, 137, 155) |
| HSL | hsl(197, 27%, 48%) |
| HSV | hsv(197, 42%, 61%) |
| CMYK | cmyk(41.9%, 11.6%, 0%, 39.2%) |
| CIE-LAB | lab(54.48, -11.05, -14.60) |
| CIE-LCH | lch(54.48, 18.31, 232.88°) |
| OKLab | oklab(60.32% -0.0415 -0.0402) |
| OKLCH | oklch(60.32% 0.058 224.1) |
| XYZ | xyz(19.0764, 22.4303, 34.3282) |
| Luminance | 0.2243 (WCAG relative) |
| Temperature | cool |
| Family | cyan |
Closest named colors
Dirty Blue
#3F829D
ΔE00 4.65
Bluish Grey
#748B97
ΔE00 5.95
Grey Blue
#647D8E
ΔE00 6.54
Greyish Blue
#5E819D
ΔE00 6.60
Steel Grey
#6F828A
ΔE00 7.02
Teal Blue
#01889F
ΔE00 7.36
Perceptual scales
Shades
Tints
Tones
OKLCH scale
Color harmonies
complementary
#5A899B #9B6C5A
analogous
#5A9B8C #5A899B #5A689B
triadic
#5A899B #9B5A89 #899B5A
tetradic
#5A899B #8C5A9B #9B6C5A #689B5A
square
#5A899B #8C5A9B #9B6C5A #689B5A
split-complementary
#5A899B #9B5A68 #9B8C5A
monochromatic
#2D454E #446774 #5A899B #7EA5B4 #A5C0CB
Accessibility & contrast
On white
3.83
#5A899B on #FFFFFF
AA ✗AA large ✓AAA ✗
On black
5.49
#5A899B on #000000
AA ✓AA large ✓AAA ✗
Best text color
#000000 on #5A899B
5.49:1 — WCAG AA (normal text) passes
Contrast matrix
| fg \ bg | ##5A899B | #FFFFFF | #000000 | ##000000 |
|---|---|---|---|---|
| ##5A899B | 1.00 | 3.83 | 5.49 | 5.49 |
| #FFFFFF | 3.83 | 1.00 | 21.00 | 21.00 |
| #000000 | 5.49 | 21.00 | 1.00 | 1.00 |
| ##000000 | 5.49 | 21.00 | 1.00 | 1.00 |
Color blindness preview
Protanopia (red-blind)
#7F879C
Deuteranopia (green-blind)
#757F9B
Tritanopia (blue-blind)
#408F8F
Achromatopsia (no color)
#828282
Design tokens & code
CSS
--color: #5a899b; /* rgb */ color: rgb(90, 137, 155); /* oklch */ color: oklch(60.3% 0.058 224.1);
Tailwind
colors: {
custom: {
50: '#8cabb8',
500: '#5a899b',
950: '#000000',
},
}SCSS
$custom: #5a899b; $custom-light: #8cabb8; $custom-dark: #000000;
JSON
{
"hex": "#5a899b",
"rgb": {
"r": 90,
"g": 137,
"b": 155
},
"hsl": {
"h": 196.615,
"s": 26.531,
"l": 48.039
},
"oklch": {
"l": 0.6032,
"c": 0.05778,
"h": 224.1
},
"luminance": 0.22432
}Semantic roles & 50–950 ramp
primary
#5A899B
secondary
#B8A198
accent
#7F65C3
background
#F8FAFB
surface
#F0F4F6
border
#CBCED0
text
#0C1011
muted
#7D7F80