#696382#696382
#696382 is a mid, muted violet. Relative luminance 0.135; OKLCH L 51.7% C 0.049 H 293.5°. Best body text is #FFFFFF at 5.66:1 contrast (WCAG AA passes).
Color values
| HEX | #696382 |
|---|---|
| RGB | rgb(105, 99, 130) |
| HSL | hsl(252, 14%, 45%) |
| HSV | hsv(252, 24%, 51%) |
| CMYK | cmyk(19.2%, 23.8%, 0%, 49%) |
| CIE-LAB | lab(43.56, 9.29, -16.37) |
| CIE-LCH | lch(43.56, 18.82, 299.57°) |
| OKLab | oklab(51.7% 0.0195 -0.0448) |
| OKLCH | oklch(51.7% 0.049 293.5) |
| XYZ | xyz(14.3159, 13.5385, 22.9737) |
| Luminance | 0.1354 (WCAG relative) |
| Temperature | cool |
| Family | violet |
Closest named colors
Purplish Grey
#7A687F
ΔE00 6.07
Grey Purple
#826D8C
ΔE00 7.36
Dusk
#4E5481
ΔE00 8.52
Dark Lavender
#856798
ΔE00 8.93
Dusty Purple
#825F87
ΔE00 8.93
Greyish Purple
#887191
ΔE00 9.08
Perceptual scales
Shades
Tints
Tones
OKLCH scale
Color harmonies
complementary
#696382 #7C8263
analogous
#636D82 #696382 #796382
triadic
#696382 #826963 #638269
tetradic
#696382 #82636D #7C8263 #638279
square
#696382 #82636D #7C8263 #638279
split-complementary
#696382 #827963 #6D8263
monochromatic
#312E3D #4D495F #696382 #8882A0 #A9A5BA
Accessibility & contrast
On white
5.66
#696382 on #FFFFFF
AA ✓AA large ✓AAA ✗
On black
3.71
#696382 on #000000
AA ✗AA large ✓AAA ✗
Best text color
#FFFFFF on #696382
5.66:1 — WCAG AA (normal text) passes
Contrast matrix
| fg \ bg | ##696382 | #FFFFFF | #000000 | ##FFFFFF |
|---|---|---|---|---|
| ##696382 | 1.00 | 5.66 | 3.71 | 5.66 |
| #FFFFFF | 5.66 | 1.00 | 21.00 | 1.00 |
| #000000 | 3.71 | 21.00 | 1.00 | 21.00 |
| ##FFFFFF | 5.66 | 1.00 | 21.00 | 1.00 |
Color blindness preview
Protanopia (red-blind)
#5C6783
Deuteranopia (green-blind)
#5D6681
Tritanopia (blue-blind)
#64686E
Achromatopsia (no color)
#676767
Design tokens & code
CSS
--color: #696382; /* rgb */ color: rgb(105, 99, 130); /* oklch */ color: oklch(51.7% 0.049 293.5);
Tailwind
colors: {
custom: {
50: '#948fa6',
500: '#696382',
950: '#000000',
},
}SCSS
$custom: #696382; $custom-light: #948fa6; $custom-dark: #000000;
JSON
{
"hex": "#696382",
"rgb": {
"r": 105,
"g": 99,
"b": 130
},
"hsl": {
"h": 251.613,
"s": 13.537,
"l": 44.902
},
"oklch": {
"l": 0.51701,
"c": 0.04885,
"h": 293.5
},
"luminance": 0.13539
}Semantic roles & 50–950 ramp
primary
#696382
secondary
#A6A997
accent
#B671A9
background
#F9F8FA
surface
#F1F0F4
border
#CBCBCE
text
#0D0C0F
muted
#7E7D7F