#BA445C#BA445C
#BA445C is a mid, vivid red. Relative luminance 0.153; OKLCH L 55.5% C 0.153 H 11.3°. Best body text is #FFFFFF at 5.16:1 contrast (WCAG AA passes).
Color values
| HEX | #BA445C |
|---|---|
| RGB | rgb(186, 68, 92) |
| HSL | hsl(348, 46%, 50%) |
| HSV | hsv(348, 63%, 73%) |
| CMYK | cmyk(0%, 63.4%, 50.5%, 27.1%) |
| CIE-LAB | lab(46.11, 49.42, 11.71) |
| CIE-LCH | lch(46.11, 50.78, 13.33°) |
| OKLab | oklab(55.47% 0.1496 0.0299) |
| OKLCH | oklch(55.47% 0.153 11.3) |
| XYZ | xyz(24.2506, 15.3491, 11.8088) |
| Luminance | 0.1535 (WCAG relative) |
| Temperature | warm |
| Family | red |
Closest named colors
Dark Rose
#B5485D
ΔE00 1.11
Deep Rose
#C74767
ΔE00 3.45
Light Burgundy
#A8415B
ΔE00 4.32
Dark Pink
#CB416B
ΔE00 4.67
Light Maroon
#A24857
ΔE00 4.77
Dusty Red
#B9484E
ΔE00 5.37
Perceptual scales
Shades
Tints
Tones
OKLCH scale
Color harmonies
complementary
#BA445C #44BAA2
analogous
#BA4497 #BA445C #BA6744
triadic
#BA445C #5CBA44 #445CBA
tetradic
#BA445C #97BA44 #44BAA2 #6744BA
square
#BA445C #97BA44 #44BAA2 #6744BA
split-complementary
#BA445C #44BA67 #4497BA
monochromatic
#602330 #8D3446 #BA445C #CB7083 #DB9DAA
Accessibility & contrast
On white
5.16
#BA445C on #FFFFFF
AA ✓AA large ✓AAA ✗
On black
4.07
#BA445C on #000000
AA ✗AA large ✓AAA ✗
Best text color
#FFFFFF on #BA445C
5.16:1 — WCAG AA (normal text) passes
Contrast matrix
| fg \ bg | ##BA445C | #FFFFFF | #000000 | ##FFFFFF |
|---|---|---|---|---|
| ##BA445C | 1.00 | 5.16 | 4.07 | 5.16 |
| #FFFFFF | 5.16 | 1.00 | 21.00 | 1.00 |
| #000000 | 4.07 | 21.00 | 1.00 | 21.00 |
| ##FFFFFF | 5.16 | 1.00 | 21.00 | 1.00 |
Color blindness preview
Protanopia (red-blind)
#5F5E5C
Deuteranopia (green-blind)
#7D7659
Tritanopia (blue-blind)
#CA314D
Achromatopsia (no color)
#6D6D6D
Design tokens & code
CSS
--color: #ba445c; /* rgb */ color: rgb(186, 68, 92); /* oklch */ color: oklch(55.5% 0.153 11.3);
Tailwind
colors: {
custom: {
50: '#d47e8a',
500: '#ba445c',
950: '#000000',
},
}SCSS
$custom: #ba445c; $custom-light: #d47e8a; $custom-dark: #000000;
JSON
{
"hex": "#ba445c",
"rgb": {
"r": 186,
"g": 68,
"b": 92
},
"hsl": {
"h": 347.797,
"s": 46.457,
"l": 49.804
},
"oklch": {
"l": 0.55475,
"c": 0.1526,
"h": 11.3
},
"luminance": 0.15346
}Semantic roles & 50–950 ramp
primary
#BA445C
secondary
#92C8BD
accent
#D6BB52
background
#FDF8F8
surface
#FBEFF0
border
#D4CACB
text
#150A0B
muted
#837C7C