#A670EC#A670EC
#A670EC is a light, vivid violet. Relative luminance 0.258; OKLCH L 65.5% C 0.182 H 301.7°. Best body text is #000000 at 6.15:1 contrast (WCAG AA passes).
Color values
| HEX | #A670EC |
|---|---|
| RGB | rgb(166, 112, 236) |
| HSL | hsl(266, 77%, 68%) |
| HSV | hsv(266, 53%, 93%) |
| CMYK | cmyk(29.7%, 52.5%, 0%, 7.5%) |
| CIE-LAB | lab(57.80, 45.85, -55.00) |
| CIE-LCH | lch(57.80, 71.60, 309.81°) |
| OKLab | oklab(65.53% 0.0957 -0.1551) |
| OKLCH | oklch(65.53% 0.182 301.7) |
| XYZ | xyz(36.6569, 25.7514, 82.3799) |
| Luminance | 0.2575 (WCAG relative) |
| Temperature | cool |
| Family | violet |
Closest named colors
Light Urple
#B36FF6
ΔE00 2.49
Mediumpurple
#9370DB
ΔE00 4.06
Easter Purple
#C071FE
ΔE00 4.82
Light Purple
#BF77F6
ΔE00 4.91
Lighter Purple
#A55AF4
ΔE00 5.26
Bright Lavender
#C760FF
ΔE00 6.25
Perceptual scales
Shades
Tints
Tones
OKLCH scale
Color harmonies
complementary
#A670EC #B6EC70
analogous
#7078EC #A670EC #E470EC
triadic
#A670EC #ECA670 #70ECA6
tetradic
#A670EC #EC7078 #B6EC70 #70ECE4
square
#A670EC #EC7078 #B6EC70 #70ECE4
split-complementary
#A670EC #ECE470 #78EC70
monochromatic
#661AC7 #843AE5 #A670EC #C8A6F3 #E9DCFA
Accessibility & contrast
On white
3.41
#A670EC on #FFFFFF
AA ✗AA large ✓AAA ✗
On black
6.15
#A670EC on #000000
AA ✓AA large ✓AAA ✗
Best text color
#000000 on #A670EC
6.15:1 — WCAG AA (normal text) passes
Contrast matrix
| fg \ bg | ##A670EC | #FFFFFF | #000000 | ##000000 |
|---|---|---|---|---|
| ##A670EC | 1.00 | 3.41 | 6.15 | 6.15 |
| #FFFFFF | 3.41 | 1.00 | 21.00 | 21.00 |
| #000000 | 6.15 | 21.00 | 1.00 | 1.00 |
| ##000000 | 6.15 | 21.00 | 1.00 | 1.00 |
Color blindness preview
Protanopia (red-blind)
#438AF0
Deuteranopia (green-blind)
#548AE9
Tritanopia (blue-blind)
#9988A3
Achromatopsia (no color)
#8B8B8B
Design tokens & code
CSS
--color: #a670ec; /* rgb */ color: rgb(166, 112, 236); /* oklch */ color: oklch(65.5% 0.182 301.7);
Tailwind
colors: {
custom: {
50: '#c49af3',
500: '#a670ec',
950: '#000000',
},
}SCSS
$custom: #a670ec; $custom-light: #c49af3; $custom-dark: #000000;
JSON
{
"hex": "#a670ec",
"rgb": {
"r": 166,
"g": 112,
"b": 236
},
"hsl": {
"h": 266.129,
"s": 76.543,
"l": 68.235
},
"oklch": {
"l": 0.65534,
"c": 0.18223,
"h": 301.7
},
"luminance": 0.25751
}Semantic roles & 50–950 ramp
primary
#A670EC
secondary
#DEEFC9
accent
#D90D80
background
#FCF9FE
surface
#F8F2FD
border
#D1CCD5
text
#130E17
muted
#827E85