#8356D2#8356D2
#8356D2 is a mid, vivid violet. Relative luminance 0.161; OKLCH L 56.4% C 0.183 H 296.8°. Best body text is #FFFFFF at 4.97:1 contrast (WCAG AA passes).
Color values
| HEX | #8356D2 |
|---|---|
| RGB | rgb(131, 86, 210) |
| HSL | hsl(262, 58%, 58%) |
| HSV | hsv(262, 59%, 82%) |
| CMYK | cmyk(37.6%, 59%, 0%, 17.6%) |
| CIE-LAB | lab(47.15, 45.22, -57.60) |
| CIE-LCH | lch(47.15, 73.23, 308.14°) |
| OKLab | oklab(56.36% 0.0828 -0.1637) |
| OKLCH | oklch(56.36% 0.183 296.8) |
| XYZ | xyz(24.3177, 16.1336, 62.7932) |
| Luminance | 0.1613 (WCAG relative) |
| Temperature | cool |
| Family | violet |
Closest named colors
Purpley
#8756E4
ΔE00 2.66
Light Indigo
#6D5ACF
ΔE00 4.38
Slate Blue
#6A5ACD
ΔE00 4.95
Deep Lavender
#8D5EB7
ΔE00 6.12
Dark Periwinkle
#665FD1
ΔE00 6.30
Lightish Purple
#A552E6
ΔE00 6.54
Perceptual scales
Shades
Tints
Tones
OKLCH scale
Color harmonies
complementary
#8356D2 #A5D256
analogous
#5667D2 #8356D2 #C156D2
triadic
#8356D2 #D28356 #56D283
tetradic
#8356D2 #D25667 #A5D256 #56D2C1
square
#8356D2 #D25667 #A5D256 #56D2C1
split-complementary
#8356D2 #D2C156 #67D256
monochromatic
#492589 #6331B9 #8356D2 #A686DF #CAB7EC
Accessibility & contrast
On white
4.97
#8356D2 on #FFFFFF
AA ✓AA large ✓AAA ✗
On black
4.23
#8356D2 on #000000
AA ✗AA large ✓AAA ✗
Best text color
#FFFFFF on #8356D2
4.97:1 — WCAG AA (normal text) passes
Contrast matrix
| fg \ bg | ##8356D2 | #FFFFFF | #000000 | ##FFFFFF |
|---|---|---|---|---|
| ##8356D2 | 1.00 | 4.97 | 4.23 | 4.97 |
| #FFFFFF | 4.97 | 1.00 | 21.00 | 1.00 |
| #000000 | 4.23 | 21.00 | 1.00 | 21.00 |
| ##FFFFFF | 4.97 | 1.00 | 21.00 | 1.00 |
Color blindness preview
Protanopia (red-blind)
#0270D6
Deuteranopia (green-blind)
#236ECF
Tritanopia (blue-blind)
#70718C
Achromatopsia (no color)
#707070
Design tokens & code
CSS
--color: #8356d2; /* rgb */ color: rgb(131, 86, 210); /* oklch */ color: oklch(56.4% 0.183 296.8);
Tailwind
colors: {
custom: {
50: '#ac87e0',
500: '#8356d2',
950: '#000000',
},
}SCSS
$custom: #8356d2; $custom-light: #ac87e0; $custom-dark: #000000;
JSON
{
"hex": "#8356d2",
"rgb": {
"r": 131,
"g": 86,
"b": 210
},
"hsl": {
"h": 261.774,
"s": 57.944,
"l": 58.039
},
"oklch": {
"l": 0.56359,
"c": 0.18344,
"h": 296.8
},
"luminance": 0.16134
}Semantic roles & 50–950 ramp
primary
#8356D2
secondary
#C9DBA9
accent
#E147A9
background
#FBF8FD
surface
#F6F0FB
border
#D0CBD4
text
#110B15
muted
#807C83