#525A74#525A74
#525A74 is a mid, muted blue. Relative luminance 0.104; OKLCH L 47.1% C 0.043 H 271.3°. Best body text is #FFFFFF at 6.83:1 contrast (WCAG AA passes).
Color values
| HEX | #525A74 |
|---|---|
| RGB | rgb(82, 90, 116) |
| HSL | hsl(226, 17%, 39%) |
| HSV | hsv(226, 29%, 45%) |
| CMYK | cmyk(29.3%, 22.4%, 0%, 54.5%) |
| CIE-LAB | lab(38.49, 3.40, -15.77) |
| CIE-LCH | lch(38.49, 16.13, 282.17°) |
| OKLab | oklab(47.09% 0.001 -0.0434) |
| OKLCH | oklch(47.09% 0.043 271.3) |
| XYZ | xyz(10.2874, 10.3668, 17.9786) |
| Luminance | 0.1037 (WCAG relative) |
| Temperature | cool |
| Family | blue |
Closest named colors
Dusk
#4E5481
ΔE00 5.88
Dusky Blue
#475F94
ΔE00 8.14
Twilight
#4E518B
ΔE00 8.15
Denim Blue
#3B5B92
ΔE00 9.11
Denim (survey)
#3B638C
ΔE00 9.60
Light Navy Blue
#2E5A88
ΔE00 9.98
Perceptual scales
Shades
Tints
Tones
OKLCH scale
Color harmonies
complementary
#525A74 #746C52
analogous
#526B74 #525A74 #5B5274
triadic
#525A74 #74525A #5A7452
tetradic
#525A74 #74526B #746C52 #52745B
square
#525A74 #74526B #746C52 #52745B
split-complementary
#525A74 #745B52 #6B7452
monochromatic
#1F222C #393E50 #525A74 #6C7697 #9098B0
Accessibility & contrast
On white
6.83
#525A74 on #FFFFFF
AA ✓AA large ✓AAA ✗
On black
3.07
#525A74 on #000000
AA ✗AA large ✓AAA ✗
Best text color
#FFFFFF on #525A74
6.83:1 — WCAG AA (normal text) passes
Contrast matrix
| fg \ bg | ##525A74 | #FFFFFF | #000000 | ##FFFFFF |
|---|---|---|---|---|
| ##525A74 | 1.00 | 6.83 | 3.07 | 6.83 |
| #FFFFFF | 6.83 | 1.00 | 21.00 | 1.00 |
| #000000 | 3.07 | 21.00 | 1.00 | 21.00 |
| ##FFFFFF | 6.83 | 1.00 | 21.00 | 1.00 |
Color blindness preview
Protanopia (red-blind)
#525C75
Deuteranopia (green-blind)
#4F5973
Tritanopia (blue-blind)
#495F63
Achromatopsia (no color)
#5B5B5B
Design tokens & code
CSS
--color: #525a74; /* rgb */ color: rgb(82, 90, 116); /* oklch */ color: oklch(47.1% 0.043 271.3);
Tailwind
colors: {
custom: {
50: '#83889c',
500: '#525a74',
950: '#000000',
},
}SCSS
$custom: #525a74; $custom-light: #83889c; $custom-dark: #000000;
JSON
{
"hex": "#525a74",
"rgb": {
"r": 82,
"g": 90,
"b": 116
},
"hsl": {
"h": 225.882,
"s": 17.172,
"l": 38.824
},
"oklch": {
"l": 0.47094,
"c": 0.04341,
"h": 271.3
},
"luminance": 0.10367
}Semantic roles & 50–950 ramp
primary
#525A74
secondary
#9E9884
accent
#A86EBA
background
#F8F8F9
surface
#EFEFF2
border
#CACACC
text
#0A0B0E
muted
#7C7C7E