#7D2173#7D2173
#7D2173 is a dark, vivid purple. Relative luminance 0.067; OKLCH L 42.7% C 0.157 H 332.8°. Best body text is #FFFFFF at 8.99:1 contrast (WCAG AA passes).
Color values
| HEX | #7D2173 |
|---|---|
| RGB | rgb(125, 33, 115) |
| HSL | hsl(307, 58%, 31%) |
| HSV | hsv(307, 74%, 49%) |
| CMYK | cmyk(0%, 73.6%, 8%, 51%) |
| CIE-LAB | lab(31.08, 48.56, -26.24) |
| CIE-LCH | lch(31.08, 55.20, 331.61°) |
| OKLab | oklab(42.66% 0.1398 -0.072) |
| OKLCH | oklch(42.66% 0.157 332.8) |
| XYZ | xyz(12.0959, 6.6865, 16.8699) |
| Luminance | 0.0669 (WCAG relative) |
| Temperature | neutral |
| Family | purple |
Closest named colors
Darkish Purple
#751973
ΔE00 2.45
Purple
#800080
ΔE00 4.21
Darkmagenta
#8B008B
ΔE00 5.16
Rich Purple
#720058
ΔE00 6.01
Warm Purple
#952E8F
ΔE00 6.46
Grape
#6C3461
ΔE00 6.68
Perceptual scales
Shades
Tints
Tones
OKLCH scale
Color harmonies
complementary
#7D2173 #217D2B
analogous
#59217D #7D2173 #7D2145
triadic
#7D2173 #737D21 #21737D
tetradic
#7D2173 #7D5921 #217D2B #21457D
square
#7D2173 #7D5921 #217D2B #21457D
split-complementary
#7D2173 #457D21 #217D59
monochromatic
#1C071A #4D1446 #7D2173 #AD2EA0 #CF49C1
Accessibility & contrast
On white
8.99
#7D2173 on #FFFFFF
AA ✓AA large ✓AAA ✓
On black
2.34
#7D2173 on #000000
AA ✗AA large ✗AAA ✗
Best text color
#FFFFFF on #7D2173
8.99:1 — WCAG AA (normal text) passes
Contrast matrix
| fg \ bg | ##7D2173 | #FFFFFF | #000000 | ##FFFFFF |
|---|---|---|---|---|
| ##7D2173 | 1.00 | 8.99 | 2.34 | 8.99 |
| #FFFFFF | 8.99 | 1.00 | 21.00 | 1.00 |
| #000000 | 2.34 | 21.00 | 1.00 | 21.00 |
| ##FFFFFF | 8.99 | 1.00 | 21.00 | 1.00 |
Color blindness preview
Protanopia (red-blind)
#1D4175
Deuteranopia (green-blind)
#3F4E71
Tritanopia (blue-blind)
#832A47
Achromatopsia (no color)
#494949
Design tokens & code
CSS
--color: #7d2173; /* rgb */ color: rgb(125, 33, 115); /* oklch */ color: oklch(42.7% 0.157 332.8);
Tailwind
colors: {
custom: {
50: '#a6669b',
500: '#7d2173',
950: '#000000',
},
}SCSS
$custom: #7d2173; $custom-light: #a6669b; $custom-dark: #000000;
JSON
{
"hex": "#7d2173",
"rgb": {
"r": 125,
"g": 33,
"b": 115
},
"hsl": {
"h": 306.522,
"s": 58.228,
"l": 30.98
},
"oklch": {
"l": 0.42661,
"c": 0.15729,
"h": 332.8
},
"luminance": 0.06685
}Semantic roles & 50–950 ramp
primary
#7D2173
secondary
#4AB055
accent
#E15746
background
#FAF6F9
surface
#F4EBF2
border
#CEC6CC
text
#10060E
muted
#7F7A7E