#C16F91#C16F91
#C16F91 es un color claro y moderadamente saturado de la familia rosa. Luminancia relativa 0.248; OKLCH L 64.2% C 0.111 H 354.3°. El mejor color de texto es #000000 con contraste 5.95:1 (cumple WCAG AA).
Valores del color
| HEX | #C16F91 |
|---|---|
| RGB | rgb(193, 111, 145) |
| HSL | hsl(335, 40%, 60%) |
| HSV | hsv(335, 42%, 76%) |
| CMYK | cmyk(0%, 42.5%, 24.9%, 24.3%) |
| CIE-LAB | lab(56.83, 36.73, -4.32) |
| CIE-LCH | lch(56.83, 36.98, 353.28°) |
| OKLab | oklab(64.23% 0.1106 -0.0109) |
| OKLCH | oklch(64.23% 0.111 354.3) |
| XYZ | xyz(32.7885, 24.7531, 29.8335) |
| Luminance | 0.2475 (WCAG relative) |
| Temperature | warm |
| Family | pink |
Colores con nombre más cercanos
Muted Pink
#D1768F
ΔE00 4.90
Palevioletred
#DB7093
ΔE00 5.29
Mauve (survey)
#AE7181
ΔE00 5.84
Dusky Pink
#CC7A8B
ΔE00 6.22
Old Pink
#C77986
ΔE00 6.85
Ugly Pink
#CD7584
ΔE00 6.96
Escalas perceptuales
Sombras
Matices
Tonos
OKLCH scale
Armonías de color
complementary
#C16F91 #6FC19F
analogous
#C16FBA #C16F91 #C1766F
triadic
#C16F91 #91C16F #6F91C1
tetradic
#C16F91 #BAC16F #6FC19F #766FC1
square
#C16F91 #BAC16F #6FC19F #766FC1
split-complementary
#C16F91 #6FC176 #6FBAC1
monochromatic
#7F3755 #AA4971 #C16F91 #D39AB2 #E6C5D2
Accesibilidad y contraste
On white
3.53
#C16F91 on #FFFFFF
AA ✗AA large ✓AAA ✗
On black
5.95
#C16F91 on #000000
AA ✓AA large ✓AAA ✗
Mejor color de texto
#000000 on #C16F91
5.95:1 — WCAG AA (texto normal) cumple
Matriz de contraste
| fg \ bg | ##C16F91 | #FFFFFF | #000000 | ##000000 |
|---|---|---|---|---|
| ##C16F91 | 1.00 | 3.53 | 5.95 | 5.95 |
| #FFFFFF | 3.53 | 1.00 | 21.00 | 21.00 |
| #000000 | 5.95 | 21.00 | 1.00 | 1.00 |
| ##000000 | 5.95 | 21.00 | 1.00 | 1.00 |
Vista previa de daltonismo
Protanopia (red-blind)
#798092
Deuteranopia (green-blind)
#8D8E8F
Tritanopia (blue-blind)
#CC6B7B
Achromatopsia (no color)
#888888
Tokens de diseño y código
CSS
--color: #c16f91; /* rgb */ color: rgb(193, 111, 145); /* oklch */ color: oklch(64.2% 0.111 354.3);
Tailwind
colors: {
custom: {
50: '#d69ab1',
500: '#c16f91',
950: '#000000',
},
}SCSS
$custom: #c16f91; $custom-light: #d69ab1; $custom-dark: #000000;
JSON
{
"hex": "#c16f91",
"rgb": {
"r": 193,
"g": 111,
"b": 145
},
"hsl": {
"h": 335.122,
"s": 39.806,
"l": 59.608
},
"oklch": {
"l": 0.64229,
"c": 0.11109,
"h": 354.3
},
"luminance": 0.24751
}Semantic roles & 50–950 ramp
primary
#C16F91
secondary
#B6D6C9
accent
#D09E58
background
#FDF9FA
surface
#FAF2F5
border
#D3CCCF
text
#140E10
muted
#837E7F
Laboratorio de vista previa
Laboratorio de vista previa → · Comprobador de contraste → · Generador de paletas →