#332EAB#332EAB
#332EAB is a dark, vivid blue. Relative luminance 0.056; OKLCH L 40.1% C 0.191 H 275.3°. Best body text is #FFFFFF at 9.91:1 contrast (WCAG AA passes).
Color values
| HEX | #332EAB |
|---|---|
| RGB | rgb(51, 46, 171) |
| HSL | hsl(242, 58%, 43%) |
| HSV | hsv(242, 73%, 67%) |
| CMYK | cmyk(70.2%, 73.1%, 0%, 32.9%) |
| CIE-LAB | lab(28.37, 42.32, -65.64) |
| CIE-LCH | lch(28.37, 78.10, 302.81°) |
| OKLab | oklab(40.06% 0.0175 -0.1897) |
| OKLCH | oklch(40.06% 0.191 275.3) |
| XYZ | xyz(9.6905, 5.5972, 39.0899) |
| Luminance | 0.0560 (WCAG relative) |
| Temperature | cool |
| Family | blue |
Closest named colors
Sapphire (survey)
#2138AB
ΔE00 3.66
Indigo Blue
#3A18B1
ΔE00 4.43
Ocean Blue
#4F42B5
ΔE00 6.12
True Blue
#010FCC
ΔE00 6.19
Blue With A Hint Of Purple
#533CC6
ΔE00 6.47
Royal
#0C1793
ΔE00 6.65
Perceptual scales
Shades
Tints
Tones
OKLCH scale
Color harmonies
complementary
#332EAB #A6AB2E
analogous
#2E67AB #332EAB #712EAB
triadic
#332EAB #AB332E #2EAB33
tetradic
#332EAB #AB2E67 #A6AB2E #2EAB71
square
#332EAB #AB2E67 #A6AB2E #2EAB71
split-complementary
#332EAB #AB712E #67AB2E
monochromatic
#16144B #25217B #332EAB #4E48CE #7C79DB
Accessibility & contrast
On white
9.91
#332EAB on #FFFFFF
AA ✓AA large ✓AAA ✓
On black
2.12
#332EAB on #000000
AA ✗AA large ✗AAA ✗
Best text color
#FFFFFF on #332EAB
9.91:1 — WCAG AA (normal text) passes
Contrast matrix
| fg \ bg | ##332EAB | #FFFFFF | #000000 | ##FFFFFF |
|---|---|---|---|---|
| ##332EAB | 1.00 | 9.91 | 2.12 | 9.91 |
| #FFFFFF | 9.91 | 1.00 | 21.00 | 1.00 |
| #000000 | 2.12 | 21.00 | 1.00 | 21.00 |
| ##FFFFFF | 9.91 | 1.00 | 21.00 | 1.00 |
Color blindness preview
Protanopia (red-blind)
#0048AF
Deuteranopia (green-blind)
#003DA9
Tritanopia (blue-blind)
#00516A
Achromatopsia (no color)
#434343
Design tokens & code
CSS
--color: #332eab; /* rgb */ color: rgb(51, 46, 171); /* oklch */ color: oklch(40.1% 0.191 275.3);
Tailwind
colors: {
custom: {
50: '#7c68c5',
500: '#332eab',
950: '#000000',
},
}SCSS
$custom: #332eab; $custom-light: #7c68c5; $custom-dark: #000000;
JSON
{
"hex": "#332eab",
"rgb": {
"r": 51,
"g": 46,
"b": 171
},
"hsl": {
"h": 242.4,
"s": 57.604,
"l": 42.549
},
"oklch": {
"l": 0.40057,
"c": 0.19055,
"h": 275.3
},
"luminance": 0.05598
}Semantic roles & 50–950 ramp
primary
#332EAB
secondary
#C0C372
accent
#E147DB
background
#F8F6FC
surface
#EFEBF8
border
#CAC6D1
text
#0B0613
muted
#7C7A82