#A192DD#A192DD
#A192DD es un color claro y moderadamente saturado de la familia violeta. Luminancia relativa 0.334; OKLCH L 70.2% C 0.109 H 292.5°. El mejor color de texto es #000000 con contraste 7.67:1 (cumple WCAG AA).
Valores del color
| HEX | #A192DD |
|---|---|
| RGB | rgb(161, 146, 221) |
| HSL | hsl(252, 52%, 72%) |
| HSV | hsv(252, 34%, 87%) |
| CMYK | cmyk(27.1%, 33.9%, 0%, 13.3%) |
| CIE-LAB | lab(64.45, 21.67, -36.21) |
| CIE-LCH | lch(64.45, 42.19, 300.90°) |
| OKLab | oklab(70.19% 0.0418 -0.1006) |
| OKLCH | oklch(70.19% 0.109 292.5) |
| XYZ | xyz(38.0248, 33.3547, 72.8274) |
| Luminance | 0.3336 (WCAG relative) |
| Temperature | cool |
| Family | violet |
Colores con nombre más cercanos
Perrywinkle
#8F8CE7
ΔE00 5.18
Lavender
#B39DDB
ΔE00 5.23
Pale Purple
#B790D4
ΔE00 6.58
Lavender (survey)
#C79FEF
ΔE00 7.81
Lavender Blue
#8B88F8
ΔE00 7.82
Periwinkle Blue
#8F99FB
ΔE00 8.05
Escalas perceptuales
Sombras
Matices
Tonos
OKLCH scale
Armonías de color
complementary
#A192DD #CEDD92
analogous
#92A9DD #A192DD #C792DD
triadic
#A192DD #DDA192 #92DDA1
tetradic
#A192DD #DD92A9 #CEDD92 #92DDC7
square
#A192DD #DD92A9 #CEDD92 #92DDC7
split-complementary
#A192DD #DDC792 #A9DD92
monochromatic
#543ABA #7963CE #A192DD #C9C1EC #EBE8F8
Accesibilidad y contraste
On white
2.74
#A192DD on #FFFFFF
AA ✗AA large ✗AAA ✗
On black
7.67
#A192DD on #000000
AA ✓AA large ✓AAA ✓
Mejor color de texto
#000000 on #A192DD
7.67:1 — WCAG AA (texto normal) cumple
Matriz de contraste
| fg \ bg | ##A192DD | #FFFFFF | #000000 | ##000000 |
|---|---|---|---|---|
| ##A192DD | 1.00 | 2.74 | 7.67 | 7.67 |
| #FFFFFF | 2.74 | 1.00 | 21.00 | 21.00 |
| #000000 | 7.67 | 21.00 | 1.00 | 1.00 |
| ##000000 | 7.67 | 21.00 | 1.00 | 1.00 |
Vista previa de daltonismo
Protanopia (red-blind)
#7E9DE0
Deuteranopia (green-blind)
#7F9BDB
Tritanopia (blue-blind)
#949FAD
Achromatopsia (no color)
#9C9C9C
Tokens de diseño y código
CSS
--color: #a192dd; /* rgb */ color: rgb(161, 146, 221); /* oklch */ color: oklch(70.2% 0.109 292.5);
Tailwind
colors: {
custom: {
50: '#beb2e8',
500: '#a192dd',
950: '#000000',
},
}SCSS
$custom: #a192dd; $custom-light: #beb2e8; $custom-dark: #000000;
JSON
{
"hex": "#a192dd",
"rgb": {
"r": 161,
"g": 146,
"b": 221
},
"hsl": {
"h": 252,
"s": 52.448,
"l": 71.961
},
"oklch": {
"l": 0.70193,
"c": 0.10895,
"h": 292.5
},
"luminance": 0.33355
}Semantic roles & 50–950 ramp
primary
#A192DD
secondary
#EBEFDC
accent
#C026A1
background
#FBFAFE
surface
#F7F5FC
border
#D0CFD5
text
#121016
muted
#817F84
Laboratorio de vista previa
Laboratorio de vista previa → · Comprobador de contraste → · Generador de paletas →