#E245BD#E245BD
#E245BD es un color claro y muy saturado de la familia rosa. Luminancia relativa 0.241; OKLCH L 65.2% C 0.228 H 338.9°. El mejor color de texto es #000000 con contraste 5.82:1 (cumple WCAG AA).
Valores del color
| HEX | #E245BD |
|---|---|
| RGB | rgb(226, 69, 189) |
| HSL | hsl(314, 73%, 58%) |
| HSV | hsv(314, 69%, 89%) |
| CMYK | cmyk(0%, 69.5%, 16.4%, 11.4%) |
| CIE-LAB | lab(56.19, 71.71, -30.39) |
| CIE-LCH | lch(56.19, 77.88, 337.04°) |
| OKLab | oklab(65.24% 0.2126 -0.0822) |
| OKLCH | oklch(65.24% 0.228 338.9) |
| XYZ | xyz(42.6784, 24.1031, 50.5389) |
| Luminance | 0.2410 (WCAG relative) |
| Temperature | neutral |
| Family | pink |
Colores con nombre más cercanos
Purpleish Pink
#DF4EC8
ΔE00 2.25
Hot Magenta
#F504C9
ΔE00 3.88
Pinky Purple
#C94CBE
ΔE00 4.59
Purplish Pink
#CE5DAE
ΔE00 4.74
Bright Pink
#FE01B1
ΔE00 5.27
Pinkish Purple
#D648D7
ΔE00 5.46
Escalas perceptuales
Sombras
Matices
Tonos
OKLCH scale
Armonías de color
complementary
#E245BD #45E26A
analogous
#B845E2 #E245BD #E2456E
triadic
#E245BD #BDE245 #45BDE2
tetradic
#E245BD #E2B845 #45E26A #456EE2
square
#E245BD #E2B845 #45E26A #456EE2
split-complementary
#E245BD #6EE245 #45E2B8
monochromatic
#951778 #CA20A2 #E245BD #EA7AD0 #F3AFE3
Accesibilidad y contraste
On white
3.61
#E245BD on #FFFFFF
AA ✗AA large ✓AAA ✗
On black
5.82
#E245BD on #000000
AA ✓AA large ✓AAA ✗
Mejor color de texto
#000000 on #E245BD
5.82:1 — WCAG AA (texto normal) cumple
Matriz de contraste
| fg \ bg | ##E245BD | #FFFFFF | #000000 | ##000000 |
|---|---|---|---|---|
| ##E245BD | 1.00 | 3.61 | 5.82 | 5.82 |
| #FFFFFF | 3.61 | 1.00 | 21.00 | 21.00 |
| #000000 | 5.82 | 21.00 | 1.00 | 1.00 |
| ##000000 | 5.82 | 21.00 | 1.00 | 1.00 |
Vista previa de daltonismo
Protanopia (red-blind)
#4D77C0
Deuteranopia (green-blind)
#8090B9
Tritanopia (blue-blind)
#EF4B7B
Achromatopsia (no color)
#878787
Tokens de diseño y código
CSS
--color: #e245bd; /* rgb */ color: rgb(226, 69, 189); /* oklch */ color: oklch(65.2% 0.228 338.9);
Tailwind
colors: {
custom: {
50: '#ef85d1',
500: '#e245bd',
950: '#000000',
},
}SCSS
$custom: #e245bd; $custom-light: #ef85d1; $custom-dark: #000000;
JSON
{
"hex": "#e245bd",
"rgb": {
"r": 226,
"g": 69,
"b": 189
},
"hsl": {
"h": 314.14,
"s": 73.023,
"l": 57.843
},
"oklch": {
"l": 0.65242,
"c": 0.22794,
"h": 338.9
},
"luminance": 0.24099
}Semantic roles & 50–950 ramp
primary
#E245BD
secondary
#A2E1B1
accent
#F06338
background
#FFF8FC
surface
#FFF0F9
border
#D7CBD2
text
#170C14
muted
#857D82
Laboratorio de vista previa
Laboratorio de vista previa → · Comprobador de contraste → · Generador de paletas →