Wisteria #A87DC2
Wisteria es un morado medio-claro y moderadamente saturado, con código hex #A87DC2 y RGB rgb(168, 125, 194).
Aa
El texto negro es el que mejor se lee sobre este color (6.37:1).
Sobre este color
#A87DC2 es un morado medio-claro y moderadamente saturado. En OKLCH, su luminosidad es 66%, su croma 0.110 y su matiz 312°. Su matiz queda entre las mitades cálida y fría de la rueda. Es el color con nombre Wisteria. El texto negro es el que mejor se lee sobre este color, con 6.37:1.
| Familia de matiz | Morados |
| Luminosidad | medio-claro (66%) |
| Croma | moderadamente saturado (0.110) |
| Temperatura | intermedio |
| Nombre más cercano | Wisteria |
| Texto negro | 6.37:1 |
| Texto blanco | 3.29:1 |
Colores que combinan con Wisteria
Combinaciones obtenidas al rotar Wisteria por la rueda de matiz de OKLCH, cada una con el nombre más cercano de nuestra lista.
Análogo
Matices vecinos, 30° a cada lado.
Triádico
Tres matices separados por 120°.
Paletas de colores con Wisteria
Paletas seleccionadas que contienen un color a menos de ΔE 0.06 (OKLab) de Wisteria, de la más cercana a la más lejana.
Colores con nombre similares
Los ocho colores con nombre más cercanos a Wisteria, con su distancia ΔE.
- Soft Purple #A66FB5 ΔE 0.036
- Heather #A484AC ΔE 0.043
- Deep Lilac #966EBD ΔE 0.050
- Dusty Lavender #AC86A8 ΔE 0.052
- Pale Purple #B790D4 ΔE 0.057
- Dark Lilac #9C6DA5 ΔE 0.058
- Medium Purple #9370DB ΔE 0.067
- Perrywinkle #8F8CE7 ΔE 0.067
Más sobre Wisteria
Cómo hacer Wisteria
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 morado
- 3 partes de blanco
- 1 parte de verde
Resultado de la receta: #A97ABC, una diferencia de ΔE 0.010 respecto a Wisteria. Es muy parecido: la mayoría de la gente no notará la diferencia.
Códigos de Wisteria en todos los formatos
| HEX | #A87DC2 |
| RGB | rgb(168, 125, 194) |
| HSL | hsl(277, 36%, 63%) |
| OKLCH | oklch(65.7% 0.11 312.1) |
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 #A87DC2 | 3.29:1 | AA texto grande | Lc -65.6 | Texto de contenido, no para lecturas largas |
| Texto negro sobre #A87DC2 | 6.37:1 | AA | Lc 43.9 | Elementos que no son texto, texto de marcador de posición |
| Texto #A87DC2 sobre blanco | 3.29:1 | AA texto grande | Lc 60.2 | Texto de contenido, no para lecturas largas |
| Texto #A87DC2 sobre negro | 6.37:1 | AA | Lc -41.5 | Elementos que no son texto, texto de marcador de posición |
Tonos y tintes de Wisteria
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 500.
-
Paso 50
50
#F7F4F9
oklch(97.1% 0.007 312.3)
-
Paso 100
100
#EDE7F2
oklch(93.6% 0.016 310.1)
-
Paso 200
200
#E0D4E8
oklch(88.6% 0.03 312.1)
-
Paso 300
300
#CCB7DA
oklch(80.8% 0.054 311.9)
-
Paso 400
400
#B391C8
oklch(70.7% 0.087 312.2)
-
Paso 500
500 (este color)
#A87DC2
oklch(65.7% 0.11 312.1)
-
Paso 600
600
#8B5DA6
oklch(55.7% 0.12 312)
-
Paso 700
700
#764C8E
oklch(49.1% 0.112 312.2)
-
Paso 800
800
#603F73
oklch(42.8% 0.091 312.2)
-
Paso 900
900
#4E365D
oklch(37.7% 0.071 311.6)
-
Paso 950
950
#2E2036
oklch(27.1% 0.044 312.7)
Exporta esta escala para Tailwind con la herramienta de colores de Tailwind
Wisteria 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) | #718BC5 | 0.084 |
| Deuteranopía (sin conos verdes) | #7B8FC0 | 0.078 |
| Tritanopía (sin conos azules) | #A68697 | 0.076 |
| Acromatopsia (sin color) | #8E8E8E | 0.111 |
Usa Wisteria 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.