#BA6CEC#BA6CEC
#BA6CEC is a light, vivid violet. Relative luminance 0.272; OKLCH L 67.0% C 0.194 H 310.3°. Best body text is #000000 at 6.44:1 contrast (WCAG AA passes).
Color values
| HEX | #BA6CEC |
|---|---|
| RGB | rgb(186, 108, 236) |
| HSL | hsl(277, 77%, 67%) |
| HSV | hsv(277, 54%, 93%) |
| CMYK | cmyk(21.2%, 54.2%, 0%, 7.5%) |
| CIE-LAB | lab(59.18, 52.98, -52.68) |
| CIE-LCH | lch(59.18, 74.71, 315.16°) |
| OKLab | oklab(67.04% 0.1254 -0.1477) |
| OKLCH | oklch(67.04% 0.194 310.3) |
| XYZ | xyz(40.7498, 27.2211, 82.4481) |
| Luminance | 0.2722 (WCAG relative) |
| Temperature | cool |
| Family | violet |
Closest named colors
Light Urple
#B36FF6
ΔE00 2.38
Easter Purple
#C071FE
ΔE00 2.89
Light Purple
#BF77F6
ΔE00 3.00
Bright Lavender
#C760FF
ΔE00 3.49
Bright Lilac
#C95EFB
ΔE00 3.54
Heliotrope
#D94FF5
ΔE00 6.15
Perceptual scales
Shades
Tints
Tones
OKLCH scale
Color harmonies
complementary
#BA6CEC #9EEC6C
analogous
#7A6CEC #BA6CEC #EC6CDE
triadic
#BA6CEC #ECBA6C #6CECBA
tetradic
#BA6CEC #EC7A6C #9EEC6C #6CDEEC
square
#BA6CEC #EC7A6C #9EEC6C #6CDEEC
split-complementary
#BA6CEC #DEEC6C #6CEC7A
monochromatic
#8119C4 #A136E5 #BA6CEC #D3A2F3 #EDD8FA
Accessibility & contrast
On white
3.26
#BA6CEC on #FFFFFF
AA ✗AA large ✓AAA ✗
On black
6.44
#BA6CEC on #000000
AA ✓AA large ✓AAA ✗
Best text color
#000000 on #BA6CEC
6.44:1 — WCAG AA (normal text) passes
Contrast matrix
| fg \ bg | ##BA6CEC | #FFFFFF | #000000 | ##000000 |
|---|---|---|---|---|
| ##BA6CEC | 1.00 | 3.26 | 6.44 | 6.44 |
| #FFFFFF | 3.26 | 1.00 | 21.00 | 21.00 |
| #000000 | 6.44 | 21.00 | 1.00 | 1.00 |
| ##000000 | 6.44 | 21.00 | 1.00 | 1.00 |
Color blindness preview
Protanopia (red-blind)
#468BF0
Deuteranopia (green-blind)
#6090E9
Tritanopia (blue-blind)
#B482A2
Achromatopsia (no color)
#8E8E8E
Design tokens & code
CSS
--color: #ba6cec; /* rgb */ color: rgb(186, 108, 236); /* oklch */ color: oklch(67.0% 0.194 310.3);
Tailwind
colors: {
custom: {
50: '#d299f3',
500: '#ba6cec',
950: '#000000',
},
}SCSS
$custom: #ba6cec; $custom-light: #d299f3; $custom-dark: #000000;
JSON
{
"hex": "#ba6cec",
"rgb": {
"r": 186,
"g": 108,
"b": 236
},
"hsl": {
"h": 276.563,
"s": 77.108,
"l": 67.451
},
"oklch": {
"l": 0.67041,
"c": 0.19376,
"h": 310.3
},
"luminance": 0.2722
}Semantic roles & 50–950 ramp
primary
#BA6CEC
secondary
#D6EEC6
accent
#D90C5C
background
#FDF9FE
surface
#FAF2FD
border
#D3CCD5
text
#140E17
muted
#837E85