#AA287C#AA287C
#AA287C es un color medio y vivo de la familia rosa. Luminancia relativa 0.115; OKLCH L 51.1% C 0.184 H 346.1°. El mejor color de texto es #FFFFFF con contraste 6.36:1 (cumple WCAG AA).
Valores del color
| HEX | #AA287C |
|---|---|
| RGB | rgb(170, 40, 124) |
| HSL | hsl(321, 62%, 41%) |
| HSV | hsv(321, 76%, 67%) |
| CMYK | cmyk(0%, 76.5%, 27.1%, 33.3%) |
| CIE-LAB | lab(40.44, 58.86, -16.72) |
| CIE-LCH | lch(40.44, 61.19, 344.14°) |
| OKLab | oklab(51.1% 0.1788 -0.0443) |
| OKLCH | oklch(51.1% 0.184 346.1) |
| XYZ | xyz(20.9754, 11.5212, 20.1841) |
| Luminance | 0.1152 (WCAG relative) |
| Temperature | warm |
| Family | pink |
Colores con nombre más cercanos
Magenta (survey)
#C20078
ΔE00 4.72
Mediumvioletred
#C71585
ΔE00 5.19
Red Violet
#9E0168
ΔE00 5.28
Deep Magenta
#A0025C
ΔE00 6.98
Warm Purple
#952E8F
ΔE00 7.08
Dark Fuchsia
#9D0759
ΔE00 7.58
Escalas perceptuales
Sombras
Matices
Tonos
OKLCH scale
Armonías de color
complementary
#AA287C #28AA56
analogous
#9728AA #AA287C #AA283B
triadic
#AA287C #7CAA28 #287CAA
tetradic
#AA287C #AA9728 #28AA56 #283BAA
square
#AA287C #AA9728 #28AA56 #283BAA
split-complementary
#AA287C #3BAA28 #28AA97
monochromatic
#471134 #781C58 #AA287C #D23E9D #DD6FB6
Accesibilidad y contraste
On white
6.36
#AA287C on #FFFFFF
AA ✓AA large ✓AAA ✗
On black
3.30
#AA287C on #000000
AA ✗AA large ✓AAA ✗
Mejor color de texto
#FFFFFF on #AA287C
6.36:1 — WCAG AA (texto normal) cumple
Matriz de contraste
| fg \ bg | ##AA287C | #FFFFFF | #000000 | ##FFFFFF |
|---|---|---|---|---|
| ##AA287C | 1.00 | 6.36 | 3.30 | 6.36 |
| #FFFFFF | 6.36 | 1.00 | 21.00 | 1.00 |
| #000000 | 3.30 | 21.00 | 1.00 | 21.00 |
| ##FFFFFF | 6.36 | 1.00 | 21.00 | 1.00 |
Vista previa de daltonismo
Protanopia (red-blind)
#3A517E
Deuteranopia (green-blind)
#616779
Tritanopia (blue-blind)
#B6244F
Achromatopsia (no color)
#5F5F5F
Tokens de diseño y código
CSS
--color: #aa287c; /* rgb */ color: rgb(170, 40, 124); /* oklch */ color: oklch(51.1% 0.184 346.1);
Tailwind
colors: {
custom: {
50: '#c86fa2',
500: '#aa287c',
950: '#000000',
},
}SCSS
$custom: #aa287c; $custom-light: #c86fa2; $custom-dark: #000000;
JSON
{
"hex": "#aa287c",
"rgb": {
"r": 170,
"g": 40,
"b": 124
},
"hsl": {
"h": 321.231,
"s": 61.905,
"l": 41.176
},
"oklch": {
"l": 0.51102,
"c": 0.18419,
"h": 346.1
},
"luminance": 0.11519
}Semantic roles & 50–950 ramp
primary
#AA287C
secondary
#6AC48A
accent
#E57C43
background
#FCF7F9
surface
#F9EDF2
border
#D2C8CC
text
#14080F
muted
#827B7E
Laboratorio de vista previa
Laboratorio de vista previa → · Comprobador de contraste → · Generador de paletas →