#9A596E#9A596E
#9A596E es un color medio y moderadamente saturado de la familia rosa. Luminancia relativa 0.151; OKLCH L 54.4% C 0.089 H 359.7°. El mejor color de texto es #FFFFFF con contraste 5.21:1 (cumple WCAG AA).
Valores del color
| HEX | #9A596E |
|---|---|
| RGB | rgb(154, 89, 110) |
| HSL | hsl(341, 27%, 48%) |
| HSV | hsv(341, 42%, 60%) |
| CMYK | cmyk(0%, 42.2%, 28.6%, 39.6%) |
| CIE-LAB | lab(45.83, 29.47, -0.31) |
| CIE-LCH | lch(45.83, 29.47, 359.39°) |
| OKLab | oklab(54.45% 0.0891 -0.0004) |
| OKLCH | oklch(54.45% 0.089 359.7) |
| XYZ | xyz(19.7139, 15.1421, 16.6332) |
| Luminance | 0.1514 (WCAG relative) |
| Temperature | warm |
| Family | pink |
Colores con nombre más cercanos
Dark Mauve
#874C62
ΔE00 5.56
Light Plum
#9D5783
ΔE00 6.80
Dusky Purple
#895B7B
ΔE00 6.91
Light Maroon
#A24857
ΔE00 7.24
Light Burgundy
#A8415B
ΔE00 7.50
Dark Rose
#B5485D
ΔE00 8.40
Escalas perceptuales
Sombras
Matices
Tonos
OKLCH scale
Armonías de color
complementary
#9A596E #599A85
analogous
#9A598F #9A596E #9A6459
triadic
#9A596E #6E9A59 #596E9A
tetradic
#9A596E #8F9A59 #599A85 #64599A
square
#9A596E #8F9A59 #599A85 #64599A
split-complementary
#9A596E #599A64 #598F9A
monochromatic
#4C2C37 #734352 #9A596E #B47D8E #CAA3B0
Accesibilidad y contraste
On white
5.21
#9A596E on #FFFFFF
AA ✓AA large ✓AAA ✗
On black
4.03
#9A596E on #000000
AA ✗AA large ✓AAA ✗
Mejor color de texto
#FFFFFF on #9A596E
5.21:1 — WCAG AA (texto normal) cumple
Matriz de contraste
| fg \ bg | ##9A596E | #FFFFFF | #000000 | ##FFFFFF |
|---|---|---|---|---|
| ##9A596E | 1.00 | 5.21 | 4.03 | 5.21 |
| #FFFFFF | 5.21 | 1.00 | 21.00 | 1.00 |
| #000000 | 4.03 | 21.00 | 1.00 | 21.00 |
| ##FFFFFF | 5.21 | 1.00 | 21.00 | 1.00 |
Vista previa de daltonismo
Protanopia (red-blind)
#62656F
Deuteranopia (green-blind)
#72716D
Tritanopia (blue-blind)
#A45560
Achromatopsia (no color)
#6C6C6C
Tokens de diseño y código
CSS
--color: #9a596e; /* rgb */ color: rgb(154, 89, 110); /* oklch */ color: oklch(54.4% 0.089 359.7);
Tailwind
colors: {
custom: {
50: '#b98997',
500: '#9a596e',
950: '#000000',
},
}SCSS
$custom: #9a596e; $custom-light: #b98997; $custom-dark: #000000;
JSON
{
"hex": "#9a596e",
"rgb": {
"r": 154,
"g": 89,
"b": 110
},
"hsl": {
"h": 340.615,
"s": 26.749,
"l": 47.647
},
"oklch": {
"l": 0.54448,
"c": 0.08908,
"h": 359.7
},
"luminance": 0.15141
}Semantic roles & 50–950 ramp
primary
#9A596E
secondary
#97B8AD
accent
#C3A565
background
#FBF8F9
surface
#F6F0F2
border
#D0CBCC
text
#120B0D
muted
#817C7E
Laboratorio de vista previa
Laboratorio de vista previa → · Comprobador de contraste → · Generador de paletas →