#B26587#B26587
#B26587 es un color medio y moderadamente saturado de la familia rosa. Luminancia relativa 0.205; OKLCH L 60.4% C 0.107 H 352.8°. El mejor color de texto es #000000 con contraste 5.10:1 (cumple WCAG AA).
Valores del color
| HEX | #B26587 |
|---|---|
| RGB | rgb(178, 101, 135) |
| HSL | hsl(334, 33%, 55%) |
| HSV | hsv(334, 43%, 70%) |
| CMYK | cmyk(0%, 43.3%, 24.2%, 30.2%) |
| CIE-LAB | lab(52.42, 35.32, -5.20) |
| CIE-LCH | lch(52.42, 35.70, 351.62°) |
| OKLab | oklab(60.38% 0.1062 -0.0133) |
| OKLCH | oklch(60.38% 0.107 352.8) |
| XYZ | xyz(27.3876, 20.5236, 25.4359) |
| Luminance | 0.2052 (WCAG relative) |
| Temperature | warm |
| Family | pink |
Colores con nombre más cercanos
Mauve (survey)
#AE7181
ΔE00 5.67
Light Plum
#9D5783
ΔE00 7.03
Dusky Rose
#BA6873
ΔE00 8.17
Muted Pink
#D1768F
ΔE00 8.55
Palevioletred
#DB7093
ΔE00 8.97
Darkish Pink
#DA467D
ΔE00 9.13
Escalas perceptuales
Sombras
Matices
Tonos
OKLCH scale
Armonías de color
complementary
#B26587 #65B290
analogous
#B265AE #B26587 #B26A65
triadic
#B26587 #87B265 #6587B2
tetradic
#B26587 #AEB265 #65B290 #6A65B2
square
#B26587 #AEB265 #65B290 #6A65B2
split-complementary
#B26587 #65B26A #65AEB2
monochromatic
#68344B #914969 #B26587 #C68EA7 #DBB7C7
Accesibilidad y contraste
On white
4.11
#B26587 on #FFFFFF
AA ✗AA large ✓AAA ✗
On black
5.10
#B26587 on #000000
AA ✓AA large ✓AAA ✗
Mejor color de texto
#000000 on #B26587
5.10:1 — WCAG AA (texto normal) cumple
Matriz de contraste
| fg \ bg | ##B26587 | #FFFFFF | #000000 | ##000000 |
|---|---|---|---|---|
| ##B26587 | 1.00 | 4.11 | 5.10 | 5.10 |
| #FFFFFF | 4.11 | 1.00 | 21.00 | 21.00 |
| #000000 | 5.10 | 21.00 | 1.00 | 1.00 |
| ##000000 | 5.10 | 21.00 | 1.00 | 1.00 |
Vista previa de daltonismo
Protanopia (red-blind)
#6E7588
Deuteranopia (green-blind)
#818285
Tritanopia (blue-blind)
#BC6271
Achromatopsia (no color)
#7D7D7D
Tokens de diseño y código
CSS
--color: #b26587; /* rgb */ color: rgb(178, 101, 135); /* oklch */ color: oklch(60.4% 0.107 352.8);
Tailwind
colors: {
custom: {
50: '#cb92aa',
500: '#b26587',
950: '#000000',
},
}SCSS
$custom: #b26587; $custom-light: #cb92aa; $custom-dark: #000000;
JSON
{
"hex": "#b26587",
"rgb": {
"r": 178,
"g": 101,
"b": 135
},
"hsl": {
"h": 333.506,
"s": 33.333,
"l": 54.706
},
"oklch": {
"l": 0.60375,
"c": 0.10698,
"h": 352.8
},
"luminance": 0.20522
}Semantic roles & 50–950 ramp
primary
#B26587
secondary
#A9CABB
accent
#C99A5E
background
#FCF9FA
surface
#F9F1F4
border
#D2CBCE
text
#130D10
muted
#827E7F
Laboratorio de vista previa
Laboratorio de vista previa → · Comprobador de contraste → · Generador de paletas →