#BA2A55#BA2A55
#BA2A55 es un color medio y vivo de la familia rosa. Luminancia relativa 0.128; OKLCH L 52.7% C 0.180 H 8.8°. El mejor color de texto es #FFFFFF con contraste 5.92:1 (cumple WCAG AA).
Valores del color
| HEX | #BA2A55 |
|---|---|
| RGB | rgb(186, 42, 85) |
| HSL | hsl(342, 63%, 45%) |
| HSV | hsv(342, 77%, 73%) |
| CMYK | cmyk(0%, 77.4%, 54.3%, 27.1%) |
| CIE-LAB | lab(42.39, 58.62, 10.87) |
| CIE-LCH | lch(42.39, 59.62, 10.50°) |
| OKLab | oklab(52.66% 0.1783 0.0277) |
| OKLCH | oklch(52.66% 0.18 8.8) |
| XYZ | xyz(22.7195, 12.7542, 9.8580) |
| Luminance | 0.1275 (WCAG relative) |
| Temperature | warm |
| Family | pink |
Colores con nombre más cercanos
Light Burgundy
#A8415B
ΔE00 4.39
Purplish Red
#B0054B
ΔE00 4.41
Raspberry (survey)
#B00149
ΔE00 4.56
Deep Pink
#CB0162
ΔE00 4.62
Ruby
#CA0147
ΔE00 4.70
Dark Rose
#B5485D
ΔE00 5.12
Escalas perceptuales
Sombras
Matices
Tonos
OKLCH scale
Armonías de color
complementary
#BA2A55 #2ABA8F
analogous
#BA2A9D #BA2A55 #BA472A
triadic
#BA2A55 #55BA2A #2A55BA
tetradic
#BA2A55 #9DBA2A #2ABA8F #472ABA
square
#BA2A55 #9DBA2A #2ABA8F #472ABA
split-complementary
#BA2A55 #2ABA47 #2A9DBA
monochromatic
#561327 #881F3E #BA2A55 #D64B75 #E27D9B
Accesibilidad y contraste
On white
5.92
#BA2A55 on #FFFFFF
AA ✓AA large ✓AAA ✗
On black
3.55
#BA2A55 on #000000
AA ✗AA large ✓AAA ✗
Mejor color de texto
#FFFFFF on #BA2A55
5.92:1 — WCAG AA (texto normal) cumple
Matriz de contraste
| fg \ bg | ##BA2A55 | #FFFFFF | #000000 | ##FFFFFF |
|---|---|---|---|---|
| ##BA2A55 | 1.00 | 5.92 | 3.55 | 5.92 |
| #FFFFFF | 5.92 | 1.00 | 21.00 | 1.00 |
| #000000 | 3.55 | 21.00 | 1.00 | 21.00 |
| ##FFFFFF | 5.92 | 1.00 | 21.00 | 1.00 |
Vista previa de daltonismo
Protanopia (red-blind)
#505256
Deuteranopia (green-blind)
#766E51
Tritanopia (blue-blind)
#CB003D
Achromatopsia (no color)
#646464
Tokens de diseño y código
CSS
--color: #ba2a55; /* rgb */ color: rgb(186, 42, 85); /* oklch */ color: oklch(52.7% 0.180 8.8);
Tailwind
colors: {
custom: {
50: '#d57184',
500: '#ba2a55',
950: '#000000',
},
}SCSS
$custom: #ba2a55; $custom-light: #d57184; $custom-dark: #000000;
JSON
{
"hex": "#ba2a55",
"rgb": {
"r": 186,
"g": 42,
"b": 85
},
"hsl": {
"h": 342.083,
"s": 63.158,
"l": 44.706
},
"oklch": {
"l": 0.5266,
"c": 0.18039,
"h": 8.8
},
"luminance": 0.12751
}Semantic roles & 50–950 ramp
primary
#BA2A55
secondary
#76CAB1
accent
#E6B542
background
#FEF7F8
surface
#FCEDEF
border
#D5C8CA
text
#16090A
muted
#847B7C
Laboratorio de vista previa
Laboratorio de vista previa → · Comprobador de contraste → · Generador de paletas →