#3F299A#3F299A
#3F299A is a dark, vivid violet. Relative luminance 0.050; OKLCH L 38.6% C 0.172 H 283.7°. Best body text is #FFFFFF at 10.53:1 contrast (WCAG AA passes).
Color values
| HEX | #3F299A |
|---|---|
| RGB | rgb(63, 41, 154) |
| HSL | hsl(252, 58%, 38%) |
| HSV | hsv(252, 73%, 60%) |
| CMYK | cmyk(59.1%, 73.4%, 0%, 39.6%) |
| CIE-LAB | lab(26.66, 41.21, -58.11) |
| CIE-LCH | lch(26.66, 71.24, 305.34°) |
| OKLab | oklab(38.58% 0.0409 -0.1674) |
| OKLCH | oklch(38.58% 0.172 283.7) |
| XYZ | xyz(8.6738, 4.9752, 31.0688) |
| Luminance | 0.0498 (WCAG relative) |
| Temperature | cool |
| Family | violet |
Closest named colors
Indigo Blue
#3A18B1
ΔE00 4.35
Royal
#0C1793
ΔE00 5.91
Sapphire (survey)
#2138AB
ΔE00 6.19
Darkslateblue
#483D8B
ΔE00 6.51
Cobalt Blue
#030AA7
ΔE00 6.77
Ultramarine
#2000B1
ΔE00 6.81
Perceptual scales
Shades
Tints
Tones
OKLCH scale
Color harmonies
complementary
#3F299A #849A29
analogous
#294C9A #3F299A #77299A
triadic
#3F299A #9A3F29 #299A3F
tetradic
#3F299A #9A294C #849A29 #299A77
square
#3F299A #9A294C #849A29 #299A77
split-complementary
#3F299A #9A7729 #4C9A29
monochromatic
#170F39 #2B1C6A #3F299A #5337CA #7D67D7
Accessibility & contrast
On white
10.53
#3F299A on #FFFFFF
AA ✓AA large ✓AAA ✓
On black
2.00
#3F299A on #000000
AA ✗AA large ✗AAA ✗
Best text color
#FFFFFF on #3F299A
10.53:1 — WCAG AA (normal text) passes
Contrast matrix
| fg \ bg | ##3F299A | #FFFFFF | #000000 | ##FFFFFF |
|---|---|---|---|---|
| ##3F299A | 1.00 | 10.53 | 2.00 | 10.53 |
| #FFFFFF | 10.53 | 1.00 | 21.00 | 1.00 |
| #000000 | 2.00 | 21.00 | 1.00 | 21.00 |
| ##FFFFFF | 10.53 | 1.00 | 21.00 | 1.00 |
Color blindness preview
Protanopia (red-blind)
#00429D
Deuteranopia (green-blind)
#003B98
Tritanopia (blue-blind)
#0A485F
Achromatopsia (no color)
#3F3F3F
Design tokens & code
CSS
--color: #3f299a; /* rgb */ color: rgb(63, 41, 154); /* oklch */ color: oklch(38.6% 0.172 283.7);
Tailwind
colors: {
custom: {
50: '#7f65b9',
500: '#3f299a',
950: '#000000',
},
}SCSS
$custom: #3f299a; $custom-light: #7f65b9; $custom-dark: #000000;
JSON
{
"hex": "#3f299a",
"rgb": {
"r": 63,
"g": 41,
"b": 154
},
"hsl": {
"h": 251.681,
"s": 57.949,
"l": 38.235
},
"oklch": {
"l": 0.38584,
"c": 0.1723,
"h": 283.7
},
"luminance": 0.04976
}Semantic roles & 50–950 ramp
primary
#3F299A
secondary
#ABBD62
accent
#E147C3
background
#F8F6FB
surface
#EFEBF6
border
#CAC6D0
text
#0B0612
muted
#7C7A81