#7A31CF#7A31CF
#7A31CF is a mid, highly saturated violet. Relative luminance 0.108; OKLCH L 50.4% C 0.224 H 298.9°. Best body text is #FFFFFF at 6.63:1 contrast (WCAG AA passes).
Color values
| HEX | #7A31CF |
|---|---|
| RGB | rgb(122, 49, 207) |
| HSL | hsl(268, 62%, 50%) |
| HSV | hsv(268, 76%, 81%) |
| CMYK | cmyk(41.1%, 76.3%, 0%, 18.8%) |
| CIE-LAB | lab(39.31, 60.89, -68.64) |
| CIE-LCH | lch(39.31, 91.76, 311.57°) |
| OKLab | oklab(50.44% 0.1085 -0.1963) |
| OKLCH | oklch(50.44% 0.224 298.9) |
| XYZ | xyz(20.3840, 10.8389, 60.0376) |
| Luminance | 0.1084 (WCAG relative) |
| Temperature | cool |
| Family | violet |
Closest named colors
Blueviolet
#8A2BE2
ΔE00 3.36
Burple
#6832E3
ΔE00 3.77
Bluish Purple
#703BE7
ΔE00 4.18
Darkviolet
#9400D3
ΔE00 4.78
Bluey Purple
#6241C7
ΔE00 4.82
Purpley Blue
#5F34E7
ΔE00 4.96
Perceptual scales
Shades
Tints
Tones
OKLCH scale
Color harmonies
complementary
#7A31CF #86CF31
analogous
#3137CF #7A31CF #C931CF
triadic
#7A31CF #CF7A31 #31CF7A
tetradic
#7A31CF #CF3137 #86CF31 #31CFC9
square
#7A31CF #CF3137 #86CF31 #31CFC9
split-complementary
#7A31CF #CFC931 #37CF31
monochromatic
#40196C #5D259E #7A31CF #9A63DB #BA94E6
Accessibility & contrast
On white
6.63
#7A31CF on #FFFFFF
AA ✓AA large ✓AAA ✗
On black
3.17
#7A31CF on #000000
AA ✗AA large ✓AAA ✗
Best text color
#FFFFFF on #7A31CF
6.63:1 — WCAG AA (normal text) passes
Contrast matrix
| fg \ bg | ##7A31CF | #FFFFFF | #000000 | ##FFFFFF |
|---|---|---|---|---|
| ##7A31CF | 1.00 | 6.63 | 3.17 | 6.63 |
| #FFFFFF | 6.63 | 1.00 | 21.00 | 1.00 |
| #000000 | 3.17 | 21.00 | 1.00 | 21.00 |
| ##FFFFFF | 6.63 | 1.00 | 21.00 | 1.00 |
Color blindness preview
Protanopia (red-blind)
#005DD3
Deuteranopia (green-blind)
#005BCC
Tritanopia (blue-blind)
#655B7F
Achromatopsia (no color)
#5D5D5D
Design tokens & code
CSS
--color: #7a31cf; /* rgb */ color: rgb(122, 49, 207); /* oklch */ color: oklch(50.4% 0.224 298.9);
Tailwind
colors: {
custom: {
50: '#a871df',
500: '#7a31cf',
950: '#000000',
},
}SCSS
$custom: #7a31cf; $custom-light: #a871df; $custom-dark: #000000;
JSON
{
"hex": "#7a31cf",
"rgb": {
"r": 122,
"g": 49,
"b": 207
},
"hsl": {
"h": 267.722,
"s": 62.205,
"l": 50.196
},
"oklch": {
"l": 0.5044,
"c": 0.2243,
"h": 298.9
},
"luminance": 0.10839
}Semantic roles & 50–950 ramp
primary
#7A31CF
secondary
#B1D18B
accent
#E5439A
background
#FAF7FD
surface
#F5EDFB
border
#CFC8D4
text
#110815
muted
#807B83