Violet #EE82EE
Violet es un morado medio-claro y vívido, con código hex #EE82EE y RGB rgb(238, 130, 238).
Aa
El texto negro es el que mejor se lee sobre este color (9.06:1).
Sobre este color
#EE82EE es un morado medio-claro y vívido. En OKLCH, su luminosidad es 76%, su croma 0.186 y su matiz 327°. Su matiz queda entre las mitades cálida y fría de la rueda. Es el color con nombre Violet. El texto negro es el que mejor se lee sobre este color, con 9.06:1.
| Familia de matiz | Morados |
| Luminosidad | medio-claro (76%) |
| Croma | vívido (0.186) |
| Temperatura | intermedio |
| Nombre más cercano | Violet |
| Texto negro | 9.06:1 |
| Texto blanco | 2.31:1 |
Colores que combinan con Violet
Combinaciones obtenidas al rotar Violet por la rueda de matiz de OKLCH, cada una con el nombre más cercano de nuestra lista.
Complementario
El matiz opuesto (180°).
Análogo
Matices vecinos, 30° a cada lado.
Triádico
Tres matices separados por 120°.
Paletas de colores con Violet
Paletas seleccionadas que contienen un color a menos de ΔE 0.06 (OKLab) de Violet, de la más cercana a la más lejana.
Todavía ninguna paleta seleccionada tiene un color a menos de ΔE 0.06 de Violet.
Colores con nombre similares
Los ocho colores con nombre más cercanos a Violet, con su distancia ΔE.
- Purply Pink #F075E6 ΔE 0.026
- Lavender Pink #DD85D7 ΔE 0.045
- Bubblegum Pink #FE83CC ΔE 0.059
- Orchid #DA70D6 ΔE 0.060
- Candy Pink #FF63E9 ΔE 0.060
- Light Magenta #FA5FF7 ΔE 0.069
- Violet Pink #FB5FFC ΔE 0.072
- Liliac #C48EFD ΔE 0.073
Más sobre Violet
Cómo hacer Violet
Una receta inicial con colores de pintura comunes, calculada con un modelo espectral de pintura (el modo pintura del mezclador). Los pigmentos reales varían: mezcla primero una pequeña prueba y ajusta.
- 3 partes de blanco
- 2 partes de morado
- 1 parte de rosa
Resultado de la receta: #CD94DC, una diferencia de ΔE 0.073 respecto a Violet. Es parecido; añade un poco más de una de las pinturas para igualarlo.
Códigos de Violet en todos los formatos
| HEX | #EE82EE |
| RGB | rgb(238, 130, 238) |
| HSL | hsl(300, 76%, 72%) |
| OKLCH | oklch(76.2% 0.186 327.2) |
Contraste
Las relaciones de contraste de WCAG 2 son el objetivo de conformidad: AA exige 4.5:1 para texto de cuerpo y 3:1 para texto grande; AAA exige 7:1. Los valores Lc de APCA son una guía complementaria de los borradores de WCAG 3.
| Combinación | WCAG 2 | Resultado | APCA | Guía APCA |
|---|---|---|---|---|
| Texto blanco sobre #EE82EE | 2.31:1 | No cumple | Lc -50.2 | Texto grande o en negrita, títulos |
| Texto negro sobre #EE82EE | 9.06:1 | AAA | Lc 58.7 | Texto grande o en negrita, títulos |
| Texto #EE82EE sobre blanco | 2.31:1 | No cumple | Lc 45.3 | Texto grande o en negrita, títulos |
| Texto #EE82EE sobre negro | 9.06:1 | AAA | Lc -56.8 | Texto grande o en negrita, títulos |
Tonos y tintes de Violet
Una escala de 50 a 950 creada en OKLCH: el matiz se mantiene, la luminosidad sigue una curva parecida a la de Tailwind v4 y cada paso permanece dentro de la gama sRGB. Este color está en el paso 300.
-
Paso 50
50
#FFF0FE
oklch(97.1% 0.024 327.8)
-
Paso 100
100
#FEDEFD
oklch(93.6% 0.054 327)
-
Paso 200
200
#FEC1FD
oklch(88.4% 0.104 326.9)
-
Paso 300
300 (este color)
#EE82EE
oklch(76.2% 0.186 327.2)
-
Paso 400
400
#F935FD
oklch(70.8% 0.298 327.3)
-
Paso 500
500
#DC00E1
oklch(63.1% 0.292 327.2)
-
Paso 600
600
#BA00BE
oklch(55.6% 0.257 327.2)
-
Paso 700
700
#9D00A1
oklch(49.1% 0.227 327)
-
Paso 800
800
#820085
oklch(42.8% 0.198 327.2)
-
Paso 900
900
#6D0070
oklch(37.7% 0.175 327)
-
Paso 950
950
#430045
oklch(27% 0.125 327)
Exporta esta escala para Tailwind con la herramienta de colores de Tailwind
Violet con daltonismo
Simulado con el modelo de Machado et al. (2009). ΔE es cuánto se desplaza el color: por debajo de 0.02 aproximadamente no notarías el cambio.
| Visión | Se ve como | Cambio (ΔE) |
|---|---|---|
| Protanopía (sin conos rojos) | #79A1F2 | 0.179 |
| Deuteranopía (sin conos verdes) | #97AFEB | 0.161 |
| Tritanopía (sin conos azules) | #F48DAD | 0.106 |
| Acromatopsia (sin color) | #AAAAAA | 0.188 |
Usa Violet en tu producto
Conviértelo en roles de interfaz claros y oscuros con el contraste verificado y expórtalos a Tailwind v4, shadcn/ui, CSS o design tokens.