#E2CBF5#E2CBF5
#E2CBF5 es un color muy claro y moderadamente saturado de la familia violeta. Luminancia relativa 0.655; OKLCH L 87.4% C 0.062 H 309.7°. El mejor color de texto es #000000 con contraste 14.09:1 (cumple WCAG AA).
Valores del color
| HEX | #E2CBF5 |
|---|---|
| RGB | rgb(226, 203, 245) |
| HSL | hsl(273, 68%, 88%) |
| HSV | hsv(273, 17%, 96%) |
| CMYK | cmyk(7.8%, 17.1%, 0%, 3.9%) |
| CIE-LAB | lab(84.73, 15.63, -17.68) |
| CIE-LCH | lch(84.73, 23.60, 311.48°) |
| OKLab | oklab(87.43% 0.0396 -0.0477) |
| OKLCH | oklch(87.43% 0.062 309.7) |
| XYZ | xyz(69.1986, 65.4736, 95.3607) |
| Luminance | 0.6547 (WCAG relative) |
| Temperature | cool |
| Family | violet |
Colores con nombre más cercanos
Pale Lavender
#EECFFE
ΔE00 2.55
Pale Lilac
#E4CBFF
ΔE00 2.57
Light Lavender
#DFC5FE
ΔE00 3.90
Light Lilac
#EDC8FF
ΔE00 3.98
Very Light Purple
#F6CEFC
ΔE00 4.39
Pale Mauve
#FED0FC
ΔE00 6.00
Escalas perceptuales
Sombras
Matices
Tonos
OKLCH scale
Armonías de color
complementary
#E2CBF5 #DEF5CB
analogous
#CDCBF5 #E2CBF5 #F5CBF3
triadic
#E2CBF5 #F5E2CB #CBF5E2
tetradic
#E2CBF5 #F5CDCB #DEF5CB #CBF3F5
square
#E2CBF5 #F5CDCB #DEF5CB #CBF3F5
split-complementary
#E2CBF5 #F3F5CB #CBF5CD
monochromatic
#A964E1 #C598EB #E2CBF5 #F1E5FA #F1E5FA
Accesibilidad y contraste
On white
1.49
#E2CBF5 on #FFFFFF
AA ✗AA large ✗AAA ✗
On black
14.09
#E2CBF5 on #000000
AA ✓AA large ✓AAA ✓
Mejor color de texto
#000000 on #E2CBF5
14.09:1 — WCAG AA (texto normal) cumple
Matriz de contraste
| fg \ bg | ##E2CBF5 | #FFFFFF | #000000 | ##000000 |
|---|---|---|---|---|
| ##E2CBF5 | 1.00 | 1.49 | 14.09 | 14.09 |
| #FFFFFF | 1.49 | 1.00 | 21.00 | 21.00 |
| #000000 | 14.09 | 21.00 | 1.00 | 1.00 |
| ##000000 | 14.09 | 21.00 | 1.00 | 1.00 |
Vista previa de daltonismo
Protanopia (red-blind)
#C5D2F7
Deuteranopia (green-blind)
#C9D4F4
Tritanopia (blue-blind)
#E0D0D9
Achromatopsia (no color)
#D3D3D3
Tokens de diseño y código
CSS
--color: #e2cbf5; /* rgb */ color: rgb(226, 203, 245); /* oklch */ color: oklch(87.4% 0.062 309.7);
Tailwind
colors: {
custom: {
50: '#ebdaf8',
500: '#e2cbf5',
950: '#000000',
},
}SCSS
$custom: #e2cbf5; $custom-light: #ebdaf8; $custom-dark: #000000;
JSON
{
"hex": "#e2cbf5",
"rgb": {
"r": 226,
"g": 203,
"b": 245
},
"hsl": {
"h": 272.857,
"s": 67.742,
"l": 87.843
},
"oklch": {
"l": 0.87431,
"c": 0.06203,
"h": 309.7
},
"luminance": 0.65473
}Semantic roles & 50–950 ramp
primary
#E2CBF5
secondary
#AFD78E
accent
#D0166A
background
#FEFEFF
surface
#FDFBFF
border
#D5D4D7
text
#161517
muted
#848485
Laboratorio de vista previa
Laboratorio de vista previa → · Comprobador de contraste → · Generador de paletas →