#344A95#344A95
#344A95 is a dark, vivid blue. Relative luminance 0.078; OKLCH L 43.3% C 0.126 H 268.5°. Best body text is #FFFFFF at 8.20:1 contrast (WCAG AA passes).
Color values
| HEX | #344A95 |
|---|---|
| RGB | rgb(52, 74, 149) |
| HSL | hsl(226, 48%, 39%) |
| HSV | hsv(226, 65%, 58%) |
| CMYK | cmyk(65.1%, 50.3%, 0%, 41.6%) |
| CIE-LAB | lab(33.56, 16.70, -43.89) |
| CIE-LCH | lch(33.56, 46.96, 290.83°) |
| OKLab | oklab(43.33% -0.0034 -0.1257) |
| OKLCH | oklch(43.33% 0.126 268.5) |
| XYZ | xyz(9.2879, 7.7967, 29.4434) |
| Luminance | 0.0780 (WCAG relative) |
| Temperature | cool |
| Family | blue |
Closest named colors
Cobalt (survey)
#1E488F
ΔE00 3.25
Cobalt
#0047AB
ΔE00 4.45
Dusk Blue
#26538D
ΔE00 5.34
Blueberry
#464196
ΔE00 5.48
Twilight
#4E518B
ΔE00 5.86
Denim Blue
#3B5B92
ΔE00 5.94
Perceptual scales
Shades
Tints
Tones
OKLCH scale
Color harmonies
complementary
#344A95 #957F34
analogous
#347B95 #344A95 #4F3495
triadic
#344A95 #95344A #4A9534
tetradic
#344A95 #95347B #957F34 #34954F
square
#344A95 #95347B #957F34 #34954F
split-complementary
#344A95 #954F34 #7B9534
monochromatic
#141D3A #243368 #344A95 #4762BF #7589CF
Accessibility & contrast
On white
8.20
#344A95 on #FFFFFF
AA ✓AA large ✓AAA ✓
On black
2.56
#344A95 on #000000
AA ✗AA large ✗AAA ✗
Best text color
#FFFFFF on #344A95
8.20:1 — WCAG AA (normal text) passes
Contrast matrix
| fg \ bg | ##344A95 | #FFFFFF | #000000 | ##FFFFFF |
|---|---|---|---|---|
| ##344A95 | 1.00 | 8.20 | 2.56 | 8.20 |
| #FFFFFF | 8.20 | 1.00 | 21.00 | 1.00 |
| #000000 | 2.56 | 21.00 | 1.00 | 21.00 |
| ##FFFFFF | 8.20 | 1.00 | 21.00 | 1.00 |
Color blindness preview
Protanopia (red-blind)
#225498
Deuteranopia (green-blind)
#0A4B93
Tritanopia (blue-blind)
#005B68
Achromatopsia (no color)
#4F4F4F
Design tokens & code
CSS
--color: #344a95; /* rgb */ color: rgb(52, 74, 149); /* oklch */ color: oklch(43.3% 0.126 268.5);
Tailwind
colors: {
custom: {
50: '#767cb5',
500: '#344a95',
950: '#000000',
},
}SCSS
$custom: #344a95; $custom-light: #767cb5; $custom-dark: #000000;
JSON
{
"hex": "#344a95",
"rgb": {
"r": 52,
"g": 74,
"b": 149
},
"hsl": {
"h": 226.392,
"s": 48.259,
"l": 39.412
},
"oklch": {
"l": 0.4333,
"c": 0.12576,
"h": 268.5
},
"luminance": 0.07798
}Semantic roles & 50–950 ramp
primary
#344A95
secondary
#B7A66E
accent
#B950D8
background
#F7F7FB
surface
#EEEEF6
border
#C9C9D0
text
#090911
muted
#7B7B80