#745CBC#745CBC
#745CBC is a mid, vivid violet. Relative luminance 0.150; OKLCH L 54.4% C 0.145 H 292.4°. Best body text is #FFFFFF at 5.25:1 contrast (WCAG AA passes).
Color values
| HEX | #745CBC |
|---|---|
| RGB | rgb(116, 92, 188) |
| HSL | hsl(255, 42%, 55%) |
| HSV | hsv(255, 51%, 74%) |
| CMYK | cmyk(38.3%, 51.1%, 0%, 26.3%) |
| CIE-LAB | lab(45.63, 32.26, -47.42) |
| CIE-LCH | lch(45.63, 57.36, 304.23°) |
| OKLab | oklab(54.45% 0.0554 -0.1343) |
| OKLCH | oklch(54.45% 0.145 292.4) |
| XYZ | xyz(20.1043, 14.9976, 49.4028) |
| Luminance | 0.1500 (WCAG relative) |
| Temperature | cool |
| Family | violet |
Closest named colors
Light Indigo
#6D5ACF
ΔE00 3.60
Slate Blue
#6A5ACD
ΔE00 3.67
Iris
#6258C4
ΔE00 4.13
Dark Periwinkle
#665FD1
ΔE00 4.83
Royal Purple
#7851A9
ΔE00 5.00
Deep Lavender
#8D5EB7
ΔE00 6.01
Perceptual scales
Shades
Tints
Tones
OKLCH scale
Color harmonies
complementary
#745CBC #A4BC5C
analogous
#5C74BC #745CBC #A45CBC
triadic
#745CBC #BC745C #5CBC74
tetradic
#745CBC #BC5C74 #A4BC5C #5CBCA4
square
#745CBC #BC5C74 #A4BC5C #5CBCA4
split-complementary
#745CBC #BCA45C #74BC5C
monochromatic
#3E2E70 #57409B #745CBC #9987CE #BEB3E0
Accessibility & contrast
On white
5.25
#745CBC on #FFFFFF
AA ✓AA large ✓AAA ✗
On black
4.00
#745CBC on #000000
AA ✗AA large ✓AAA ✗
Best text color
#FFFFFF on #745CBC
5.25:1 — WCAG AA (normal text) passes
Contrast matrix
| fg \ bg | ##745CBC | #FFFFFF | #000000 | ##FFFFFF |
|---|---|---|---|---|
| ##745CBC | 1.00 | 5.25 | 4.00 | 5.25 |
| #FFFFFF | 5.25 | 1.00 | 21.00 | 1.00 |
| #000000 | 4.00 | 21.00 | 1.00 | 21.00 |
| ##FFFFFF | 5.25 | 1.00 | 21.00 | 1.00 |
Color blindness preview
Protanopia (red-blind)
#356DBF
Deuteranopia (green-blind)
#3A6ABA
Tritanopia (blue-blind)
#626F83
Achromatopsia (no color)
#6C6C6C
Design tokens & code
CSS
--color: #745cbc; /* rgb */ color: rgb(116, 92, 188); /* oklch */ color: oklch(54.4% 0.145 292.4);
Tailwind
colors: {
custom: {
50: '#a08ad1',
500: '#745cbc',
950: '#000000',
},
}SCSS
$custom: #745cbc; $custom-light: #a08ad1; $custom-dark: #000000;
JSON
{
"hex": "#745cbc",
"rgb": {
"r": 116,
"g": 92,
"b": 188
},
"hsl": {
"h": 255,
"s": 41.739,
"l": 54.902
},
"oklch": {
"l": 0.5445,
"c": 0.14525,
"h": 292.4
},
"luminance": 0.14998
}Semantic roles & 50–950 ramp
primary
#745CBC
secondary
#C4CEA6
accent
#D256B3
background
#FAF8FC
surface
#F4F0F9
border
#CECBD2
text
#0F0C14
muted
#7F7D82