#3A438C#3A438C
#3A438C is a dark, vivid blue. Relative luminance 0.068; OKLCH L 41.6% C 0.120 H 274.6°. Best body text is #FFFFFF at 8.89:1 contrast (WCAG AA passes).
Color values
| HEX | #3A438C |
|---|---|
| RGB | rgb(58, 67, 140) |
| HSL | hsl(233, 41%, 39%) |
| HSV | hsv(233, 59%, 55%) |
| CMYK | cmyk(58.6%, 52.1%, 0%, 45.1%) |
| CIE-LAB | lab(31.36, 19.31, -41.90) |
| CIE-LCH | lch(31.36, 46.13, 294.74°) |
| OKLab | oklab(41.57% 0.0097 -0.1198) |
| OKLCH | oklch(41.57% 0.12 274.6) |
| XYZ | xyz(8.4842, 6.8067, 25.6726) |
| Luminance | 0.0681 (WCAG relative) |
| Temperature | cool |
| Family | blue |
Closest named colors
Blueberry
#464196
ΔE00 3.25
Darkslateblue
#483D8B
ΔE00 4.17
Cobalt (survey)
#1E488F
ΔE00 5.49
Twilight
#4E518B
ΔE00 5.53
Sapphire (survey)
#2138AB
ΔE00 6.46
Cobalt
#0047AB
ΔE00 6.79
Perceptual scales
Shades
Tints
Tones
OKLCH scale
Color harmonies
complementary
#3A438C #8C833A
analogous
#3A6C8C #3A438C #5A3A8C
triadic
#3A438C #8C3A43 #438C3A
tetradic
#3A438C #8C3A6C #8C833A #3A8C5A
square
#3A438C #8C3A6C #8C833A #3A8C5A
split-complementary
#3A438C #8C5A3A #6C8C3A
monochromatic
#161A35 #282E61 #3A438C #4E59B6 #7982C7
Accessibility & contrast
On white
8.89
#3A438C on #FFFFFF
AA ✓AA large ✓AAA ✓
On black
2.36
#3A438C on #000000
AA ✗AA large ✗AAA ✗
Best text color
#FFFFFF on #3A438C
8.89:1 — WCAG AA (normal text) passes
Contrast matrix
| fg \ bg | ##3A438C | #FFFFFF | #000000 | ##FFFFFF |
|---|---|---|---|---|
| ##3A438C | 1.00 | 8.89 | 2.36 | 8.89 |
| #FFFFFF | 8.89 | 1.00 | 21.00 | 1.00 |
| #000000 | 2.36 | 21.00 | 1.00 | 21.00 |
| ##FFFFFF | 8.89 | 1.00 | 21.00 | 1.00 |
Color blindness preview
Protanopia (red-blind)
#1C4D8F
Deuteranopia (green-blind)
#0D468A
Tritanopia (blue-blind)
#065461
Achromatopsia (no color)
#4A4A4A
Design tokens & code
CSS
--color: #3a438c; /* rgb */ color: rgb(58, 67, 140); /* oklch */ color: oklch(41.6% 0.120 274.6);
Tailwind
colors: {
custom: {
50: '#7877ae',
500: '#3a438c',
950: '#000000',
},
}SCSS
$custom: #3a438c; $custom-light: #7877ae; $custom-dark: #000000;
JSON
{
"hex": "#3a438c",
"rgb": {
"r": 58,
"g": 67,
"b": 140
},
"hsl": {
"h": 233.415,
"s": 41.414,
"l": 38.824
},
"oklch": {
"l": 0.41573,
"c": 0.12018,
"h": 274.6
},
"luminance": 0.06807
}Semantic roles & 50–950 ramp
primary
#3A438C
secondary
#B1AA71
accent
#C457D1
background
#F7F7FA
surface
#EEEDF4
border
#C9C8CE
text
#090810
muted
#7B7B7F