#6347E0#6347E0
#6347E0 is a mid, highly saturated violet. Relative luminance 0.125; OKLCH L 52.3% C 0.220 H 284.2°. Best body text is #FFFFFF at 5.99:1 contrast (WCAG AA passes).
Color values
| HEX | #6347E0 |
|---|---|
| RGB | rgb(99, 71, 224) |
| HSL | hsl(251, 71%, 58%) |
| HSV | hsv(251, 68%, 88%) |
| CMYK | cmyk(55.8%, 68.3%, 0%, 12.2%) |
| CIE-LAB | lab(42.06, 51.28, -74.00) |
| CIE-LCH | lch(42.06, 90.03, 304.72°) |
| OKLab | oklab(52.27% 0.0539 -0.2129) |
| OKLCH | oklch(52.27% 0.22 284.2) |
| XYZ | xyz(20.8493, 12.5397, 71.8283) |
| Luminance | 0.1254 (WCAG relative) |
| Temperature | cool |
| Family | violet |
Closest named colors
Purpleish Blue
#6140EF
ΔE00 2.13
Bluish Purple
#703BE7
ΔE00 3.05
Bluey Purple
#6241C7
ΔE00 3.84
Purpley Blue
#5F34E7
ΔE00 3.92
Burple
#6832E3
ΔE00 4.23
Blurple
#5539CC
ΔE00 4.98
Perceptual scales
Shades
Tints
Tones
OKLCH scale
Color harmonies
complementary
#6347E0 #C4E047
analogous
#4778E0 #6347E0 #AF47E0
triadic
#6347E0 #E06347 #47E063
tetradic
#6347E0 #E04778 #C4E047 #47E0AF
square
#6347E0 #E04778 #C4E047 #47E0AF
split-complementary
#6347E0 #E0AF47 #78E047
monochromatic
#2F1994 #4022C8 #6347E0 #8F7BE9 #BCB0F2
Accessibility & contrast
On white
5.99
#6347E0 on #FFFFFF
AA ✓AA large ✓AAA ✗
On black
3.51
#6347E0 on #000000
AA ✗AA large ✓AAA ✗
Best text color
#FFFFFF on #6347E0
5.99:1 — WCAG AA (normal text) passes
Contrast matrix
| fg \ bg | ##6347E0 | #FFFFFF | #000000 | ##FFFFFF |
|---|---|---|---|---|
| ##6347E0 | 1.00 | 5.99 | 3.51 | 5.99 |
| #FFFFFF | 5.99 | 1.00 | 21.00 | 1.00 |
| #000000 | 3.51 | 21.00 | 1.00 | 21.00 |
| ##FFFFFF | 5.99 | 1.00 | 21.00 | 1.00 |
Color blindness preview
Protanopia (red-blind)
#0068E5
Deuteranopia (green-blind)
#005EDD
Tritanopia (blue-blind)
#256F8E
Achromatopsia (no color)
#636363
Design tokens & code
CSS
--color: #6347e0; /* rgb */ color: rgb(99, 71, 224); /* oklch */ color: oklch(52.3% 0.220 284.2);
Tailwind
colors: {
custom: {
50: '#9b7ceb',
500: '#6347e0',
950: '#000000',
},
}SCSS
$custom: #6347e0; $custom-light: #9b7ceb; $custom-dark: #000000;
JSON
{
"hex": "#6347e0",
"rgb": {
"r": 99,
"g": 71,
"b": 224
},
"hsl": {
"h": 250.98,
"s": 71.163,
"l": 57.843
},
"oklch": {
"l": 0.52269,
"c": 0.21961,
"h": 284.2
},
"luminance": 0.12541
}Semantic roles & 50–950 ramp
primary
#6347E0
secondary
#D5E0A3
accent
#EE3ACD
background
#FAF7FE
surface
#F4EEFD
border
#CEC9D5
text
#0F0A16
muted
#7F7C84