#B97CA5#B97CA5
#B97CA5 es un color claro y moderadamente saturado de la familia rosa. Luminancia relativa 0.274; OKLCH L 66.2% C 0.093 H 339.6°. El mejor color de texto es #000000 con contraste 6.49:1 (cumple WCAG AA).
Valores del color
| HEX | #B97CA5 |
|---|---|
| RGB | rgb(185, 124, 165) |
| HSL | hsl(320, 30%, 61%) |
| HSV | hsv(320, 33%, 73%) |
| CMYK | cmyk(0%, 33%, 10.8%, 27.5%) |
| CIE-LAB | lab(59.39, 30.02, -12.18) |
| CIE-LCH | lch(59.39, 32.39, 337.92°) |
| OKLab | oklab(66.17% 0.0872 -0.0324) |
| OKLCH | oklch(66.17% 0.093 339.6) |
| XYZ | xyz(34.0067, 27.4478, 39.0967) |
| Luminance | 0.2745 (WCAG relative) |
| Temperature | warm |
| Family | pink |
Colores con nombre más cercanos
Dusty Lavender
#AC86A8
ΔE00 4.96
Heather
#A484AC
ΔE00 6.64
Pale Magenta
#D767AD
ΔE00 7.75
Orchid (survey)
#C875C4
ΔE00 7.91
Dark Lilac
#9C6DA5
ΔE00 8.78
Dull Pink
#D5869D
ΔE00 8.86
Escalas perceptuales
Sombras
Matices
Tonos
OKLCH scale
Armonías de color
complementary
#B97CA5 #7CB990
analogous
#AE7CB9 #B97CA5 #B97C86
triadic
#B97CA5 #A5B97C #7CA5B9
tetradic
#B97CA5 #B9AE7C #7CB990 #7C86B9
square
#B97CA5 #B9AE7C #7CB990 #7C86B9
split-complementary
#B97CA5 #86B97C #7CB9AE
monochromatic
#7A4167 #A25689 #B97CA5 #CEA4C0 #E4CCDC
Accesibilidad y contraste
On white
3.24
#B97CA5 on #FFFFFF
AA ✗AA large ✓AAA ✗
On black
6.49
#B97CA5 on #000000
AA ✓AA large ✓AAA ✗
Mejor color de texto
#000000 on #B97CA5
6.49:1 — WCAG AA (texto normal) cumple
Matriz de contraste
| fg \ bg | ##B97CA5 | #FFFFFF | #000000 | ##000000 |
|---|---|---|---|---|
| ##B97CA5 | 1.00 | 3.24 | 6.49 | 6.49 |
| #FFFFFF | 3.24 | 1.00 | 21.00 | 21.00 |
| #000000 | 6.49 | 21.00 | 1.00 | 1.00 |
| ##000000 | 6.49 | 21.00 | 1.00 | 1.00 |
Vista previa de daltonismo
Protanopia (red-blind)
#7E89A7
Deuteranopia (green-blind)
#8D92A3
Tritanopia (blue-blind)
#C07D8A
Achromatopsia (no color)
#8F8F8F
Tokens de diseño y código
CSS
--color: #b97ca5; /* rgb */ color: rgb(185, 124, 165); /* oklch */ color: oklch(66.2% 0.093 339.6);
Tailwind
colors: {
custom: {
50: '#cfa2bf',
500: '#b97ca5',
950: '#000000',
},
}SCSS
$custom: #b97ca5; $custom-light: #cfa2bf; $custom-dark: #000000;
JSON
{
"hex": "#b97ca5",
"rgb": {
"r": 185,
"g": 124,
"b": 165
},
"hsl": {
"h": 319.672,
"s": 30.348,
"l": 60.588
},
"oklch": {
"l": 0.66167,
"c": 0.09302,
"h": 339.6
},
"luminance": 0.27446
}Semantic roles & 50–950 ramp
primary
#B97CA5
secondary
#BDD4C4
accent
#A9603C
background
#FCFAFB
surface
#F9F4F7
border
#D2CED0
text
#140F12
muted
#827F81
Laboratorio de vista previa
Laboratorio de vista previa → · Comprobador de contraste → · Generador de paletas →