#E1A2C2#E1A2C2
#E1A2C2 es un color claro y moderadamente saturado de la familia rosa. Luminancia relativa 0.457; OKLCH L 78.1% C 0.085 H 347.4°. El mejor color de texto es #000000 con contraste 10.15:1 (cumple WCAG AA).
Valores del color
| HEX | #E1A2C2 |
|---|---|
| RGB | rgb(225, 162, 194) |
| HSL | hsl(330, 51%, 76%) |
| HSV | hsv(330, 28%, 88%) |
| CMYK | cmyk(0%, 28%, 13.8%, 11.8%) |
| CIE-LAB | lab(73.38, 28.11, -7.11) |
| CIE-LCH | lch(73.38, 29.00, 345.80°) |
| OKLab | oklab(78.14% 0.0828 -0.0186) |
| OKLCH | oklch(78.14% 0.085 347.4) |
| XYZ | xyz(53.7093, 45.7457, 57.0292) |
| Luminance | 0.4574 (WCAG relative) |
| Temperature | warm |
| Family | pink |
Colores con nombre más cercanos
Faded Pink
#DE9DAC
ΔE00 5.79
Powder Pink
#FFB2D0
ΔE00 5.84
Lilac
#C8A2C8
ΔE00 6.60
Baby Pink
#FFB7CE
ΔE00 6.90
Dusty Pink
#D8A7B1
ΔE00 6.97
Pig Pink
#E78EA5
ΔE00 7.57
Escalas perceptuales
Sombras
Matices
Tonos
OKLCH scale
Armonías de color
complementary
#E1A2C2 #A2E1C1
analogous
#E1A2E1 #E1A2C2 #E1A2A2
triadic
#E1A2C2 #C2E1A2 #A2C2E1
tetradic
#E1A2C2 #E1E1A2 #A2E1C1 #A2A2E1
square
#E1A2C2 #E1E1A2 #A2E1C1 #A2A2E1
split-complementary
#E1A2C2 #A2E1A2 #A2E1E1
monochromatic
#C34585 #D274A4 #E1A2C2 #F0D0E0 #F8E8F0
Accesibilidad y contraste
On white
2.07
#E1A2C2 on #FFFFFF
AA ✗AA large ✗AAA ✗
On black
10.15
#E1A2C2 on #000000
AA ✓AA large ✓AAA ✓
Mejor color de texto
#000000 on #E1A2C2
10.15:1 — WCAG AA (texto normal) cumple
Matriz de contraste
| fg \ bg | ##E1A2C2 | #FFFFFF | #000000 | ##000000 |
|---|---|---|---|---|
| ##E1A2C2 | 1.00 | 2.07 | 10.15 | 10.15 |
| #FFFFFF | 2.07 | 1.00 | 21.00 | 21.00 |
| #000000 | 10.15 | 21.00 | 1.00 | 1.00 |
| ##000000 | 10.15 | 21.00 | 1.00 | 1.00 |
Vista previa de daltonismo
Protanopia (red-blind)
#A7AEC3
Deuteranopia (green-blind)
#B5B8C0
Tritanopia (blue-blind)
#EAA1AD
Achromatopsia (no color)
#B4B4B4
Tokens de diseño y código
CSS
--color: #e1a2c2; /* rgb */ color: rgb(225, 162, 194); /* oklch */ color: oklch(78.1% 0.085 347.4);
Tailwind
colors: {
custom: {
50: '#ebbed4',
500: '#e1a2c2',
950: '#000000',
},
}SCSS
$custom: #e1a2c2; $custom-light: #ebbed4; $custom-dark: #000000;
JSON
{
"hex": "#e1a2c2",
"rgb": {
"r": 225,
"g": 162,
"b": 194
},
"hsl": {
"h": 329.524,
"s": 51.22,
"l": 75.882
},
"oklch": {
"l": 0.78142,
"c": 0.08489,
"h": 347.4
},
"luminance": 0.45743
}Semantic roles & 50–950 ramp
primary
#E1A2C2
secondary
#DCEFE5
accent
#BF7227
background
#FEFBFD
surface
#FDF7FA
border
#D5D0D3
text
#161214
muted
#848183
Laboratorio de vista previa
Laboratorio de vista previa → · Comprobador de contraste → · Generador de paletas →