#AA286F#AA286F
#AA286F es un color medio y vivo de la familia rosa. Luminancia relativa 0.112; OKLCH L 50.6% C 0.177 H 352.1°. El mejor color de texto es #FFFFFF con contraste 6.48:1 (cumple WCAG AA).
Valores del color
| HEX | #AA286F |
|---|---|
| RGB | rgb(170, 40, 111) |
| HSL | hsl(327, 62%, 41%) |
| HSV | hsv(327, 76%, 67%) |
| CMYK | cmyk(0%, 76.5%, 34.7%, 33.3%) |
| CIE-LAB | lab(39.94, 57.30, -9.39) |
| CIE-LCH | lch(39.94, 58.07, 350.69°) |
| OKLab | oklab(50.57% 0.1757 -0.0242) |
| OKLCH | oklch(50.57% 0.177 352.1) |
| XYZ | xyz(20.2068, 11.2138, 16.1362) |
| Luminance | 0.1121 (WCAG relative) |
| Temperature | warm |
| Family | pink |
Colores con nombre más cercanos
Magenta (survey)
#C20078
ΔE00 4.18
Red Violet
#9E0168
ΔE00 4.90
Deep Magenta
#A0025C
ΔE00 4.97
Dark Fuchsia
#9D0759
ΔE00 5.47
Mediumvioletred
#C71585
ΔE00 5.88
Violet Red
#A50055
ΔE00 5.98
Escalas perceptuales
Sombras
Matices
Tonos
OKLCH scale
Armonías de color
complementary
#AA286F #28AA63
analogous
#A428AA #AA286F #AA282E
triadic
#AA286F #6FAA28 #286FAA
tetradic
#AA286F #AAA428 #28AA63 #282EAA
square
#AA286F #AAA428 #28AA63 #282EAA
split-complementary
#AA286F #2EAA28 #28AAA4
monochromatic
#47112E #781C4F #AA286F #D23E8E #DD6FAB
Accesibilidad y contraste
On white
6.48
#AA286F on #FFFFFF
AA ✓AA large ✓AAA ✗
On black
3.24
#AA286F on #000000
AA ✗AA large ✓AAA ✗
Mejor color de texto
#FFFFFF on #AA286F
6.48:1 — WCAG AA (texto normal) cumple
Matriz de contraste
| fg \ bg | ##AA286F | #FFFFFF | #000000 | ##FFFFFF |
|---|---|---|---|---|
| ##AA286F | 1.00 | 6.48 | 3.24 | 6.48 |
| #FFFFFF | 6.48 | 1.00 | 21.00 | 1.00 |
| #000000 | 3.24 | 21.00 | 1.00 | 21.00 |
| ##FFFFFF | 6.48 | 1.00 | 21.00 | 1.00 |
Vista previa de daltonismo
Protanopia (red-blind)
#404F71
Deuteranopia (green-blind)
#65676C
Tritanopia (blue-blind)
#B71C48
Achromatopsia (no color)
#5E5E5E
Tokens de diseño y código
CSS
--color: #aa286f; /* rgb */ color: rgb(170, 40, 111); /* oklch */ color: oklch(50.6% 0.177 352.1);
Tailwind
colors: {
custom: {
50: '#c86f98',
500: '#aa286f',
950: '#000000',
},
}SCSS
$custom: #aa286f; $custom-light: #c86f98; $custom-dark: #000000;
JSON
{
"hex": "#aa286f",
"rgb": {
"r": 170,
"g": 40,
"b": 111
},
"hsl": {
"h": 327.231,
"s": 61.905,
"l": 41.176
},
"oklch": {
"l": 0.50567,
"c": 0.17734,
"h": 352.1
},
"luminance": 0.11211
}Semantic roles & 50–950 ramp
primary
#AA286F
secondary
#6AC493
accent
#E58C43
background
#FCF7F9
surface
#F9EDF2
border
#D2C8CC
text
#14080D
muted
#827B7E
Laboratorio de vista previa
Laboratorio de vista previa → · Comprobador de contraste → · Generador de paletas →