#774AB0#774AB0
#774AB0 is a mid, vivid violet. Relative luminance 0.120; OKLCH L 51.0% C 0.158 H 301.4°. Best body text is #FFFFFF at 6.19:1 contrast (WCAG AA passes).
Color values
| HEX | #774AB0 |
|---|---|
| RGB | rgb(119, 74, 176) |
| HSL | hsl(266, 41%, 49%) |
| HSV | hsv(266, 58%, 69%) |
| CMYK | cmyk(32.4%, 58%, 0%, 31%) |
| CIE-LAB | lab(41.14, 40.25, -47.56) |
| CIE-LCH | lch(41.14, 62.31, 310.24°) |
| OKLab | oklab(50.97% 0.082 -0.1346) |
| OKLCH | oklch(50.97% 0.158 301.4) |
| XYZ | xyz(17.8912, 11.9540, 42.4307) |
| Luminance | 0.1195 (WCAG relative) |
| Temperature | cool |
| Family | violet |
Closest named colors
Royal Purple
#7851A9
ΔE00 2.52
Bluey Purple
#6241C7
ΔE00 6.15
Purply
#983FB2
ΔE00 6.87
Rebeccapurple
#663399
ΔE00 7.09
Deep Lavender
#8D5EB7
ΔE00 7.35
Iris
#6258C4
ΔE00 7.37
Perceptual scales
Shades
Tints
Tones
OKLCH scale
Color harmonies
complementary
#774AB0 #83B04A
analogous
#4A50B0 #774AB0 #AA4AB0
triadic
#774AB0 #B0774A #4AB077
tetradic
#774AB0 #B04A50 #83B04A #4AB0AA
square
#774AB0 #B04A50 #83B04A #4AB0AA
split-complementary
#774AB0 #B0AA4A #50B04A
monochromatic
#3D265A #5A3885 #774AB0 #9773C4 #B79ED6
Accessibility & contrast
On white
6.19
#774AB0 on #FFFFFF
AA ✓AA large ✓AAA ✗
On black
3.39
#774AB0 on #000000
AA ✗AA large ✓AAA ✗
Best text color
#FFFFFF on #774AB0
6.19:1 — WCAG AA (normal text) passes
Contrast matrix
| fg \ bg | ##774AB0 | #FFFFFF | #000000 | ##FFFFFF |
|---|---|---|---|---|
| ##774AB0 | 1.00 | 6.19 | 3.39 | 6.19 |
| #FFFFFF | 6.19 | 1.00 | 21.00 | 1.00 |
| #000000 | 3.39 | 21.00 | 1.00 | 21.00 |
| ##FFFFFF | 6.19 | 1.00 | 21.00 | 1.00 |
Color blindness preview
Protanopia (red-blind)
#1B60B3
Deuteranopia (green-blind)
#2E61AE
Tritanopia (blue-blind)
#6C5F76
Achromatopsia (no color)
#616161
Design tokens & code
CSS
--color: #774ab0; /* rgb */ color: rgb(119, 74, 176); /* oklch */ color: oklch(51.0% 0.158 301.4);
Tailwind
colors: {
custom: {
50: '#a27ec8',
500: '#774ab0',
950: '#000000',
},
}SCSS
$custom: #774ab0; $custom-light: #a27ec8; $custom-dark: #000000;
JSON
{
"hex": "#774ab0",
"rgb": {
"r": 119,
"g": 74,
"b": 176
},
"hsl": {
"h": 266.471,
"s": 40.8,
"l": 49.02
},
"oklch": {
"l": 0.50966,
"c": 0.15761,
"h": 301.4
},
"luminance": 0.11954
}Semantic roles & 50–950 ramp
primary
#774AB0
secondary
#AEC393
accent
#D1579B
background
#FAF7FC
surface
#F4EEF8
border
#CEC9D1
text
#0F0A13
muted
#7F7C82