#84889A#84889A
#84889A is a light, muted blue. Relative luminance 0.248; OKLCH L 62.9% C 0.027 H 275.7°. Best body text is #000000 at 5.97:1 contrast (WCAG AA passes).
Color values
| HEX | #84889A |
|---|---|
| RGB | rgb(132, 136, 154) |
| HSL | hsl(229, 10%, 56%) |
| HSV | hsv(229, 14%, 60%) |
| CMYK | cmyk(14.3%, 11.7%, 0%, 39.6%) |
| CIE-LAB | lab(56.93, 2.36, -10.07) |
| CIE-LCH | lch(56.93, 10.34, 283.18°) |
| OKLab | oklab(62.95% 0.0027 -0.0272) |
| OKLCH | oklch(62.95% 0.027 275.7) |
| XYZ | xyz(24.1513, 24.8466, 34.0891) |
| Luminance | 0.2485 (WCAG relative) |
| Temperature | neutral |
| Family | blue |
Closest named colors
Lightslategray
#778899
ΔE00 6.24
Steel
#738595
ΔE00 7.13
Slate Gray
#708090
ΔE00 7.15
Blue Grey
#758DA3
ΔE00 7.91
Pewter
#899397
ΔE00 8.99
Gray
#808080
ΔE00 9.16
Perceptual scales
Shades
Tints
Tones
OKLCH scale
Color harmonies
complementary
#84889A #9A9684
analogous
#84939A #84889A #8B849A
triadic
#84889A #9A8488 #889A84
tetradic
#84889A #9A8493 #9A9684 #849A8B
square
#84889A #9A8493 #9A9684 #849A8B
split-complementary
#84889A #9A8B84 #939A84
monochromatic
#4A4D5A #65697B #84889A #A6A9B6 #C7C9D1
Accessibility & contrast
On white
3.52
#84889A on #FFFFFF
AA ✗AA large ✓AAA ✗
On black
5.97
#84889A on #000000
AA ✓AA large ✓AAA ✗
Best text color
#000000 on #84889A
5.97:1 — WCAG AA (normal text) passes
Contrast matrix
| fg \ bg | ##84889A | #FFFFFF | #000000 | ##000000 |
|---|---|---|---|---|
| ##84889A | 1.00 | 3.52 | 5.97 | 5.97 |
| #FFFFFF | 3.52 | 1.00 | 21.00 | 21.00 |
| #000000 | 5.97 | 21.00 | 1.00 | 1.00 |
| ##000000 | 5.97 | 21.00 | 1.00 | 1.00 |
Color blindness preview
Protanopia (red-blind)
#83899B
Deuteranopia (green-blind)
#82889A
Tritanopia (blue-blind)
#7F8B8E
Achromatopsia (no color)
#898989
Design tokens & code
CSS
--color: #84889a; /* rgb */ color: rgb(132, 136, 154); /* oklch */ color: oklch(62.9% 0.027 275.7);
Tailwind
colors: {
custom: {
50: '#a8aab7',
500: '#84889a',
950: '#000000',
},
}SCSS
$custom: #84889a; $custom-light: #a8aab7; $custom-dark: #000000;
JSON
{
"hex": "#84889a",
"rgb": {
"r": 132,
"g": 136,
"b": 154
},
"hsl": {
"h": 229.091,
"s": 9.821,
"l": 56.078
},
"oklch": {
"l": 0.6295,
"c": 0.02735,
"h": 275.7
},
"luminance": 0.24847
}Semantic roles & 50–950 ramp
primary
#84889A
secondary
#C1C0B8
accent
#A875B3
background
#FAFAFB
surface
#F4F4F6
border
#CECED0
text
#0F1011
muted
#7F7F80