#B26CA5#B26CA5
#B26CA5 es un color claro y moderadamente saturado de la familia rosa. Luminancia relativa 0.229; OKLCH L 62.6% C 0.116 H 333.9°. El mejor color de texto es #000000 con contraste 5.58:1 (cumple WCAG AA).
Valores del color
| HEX | #B26CA5 |
|---|---|
| RGB | rgb(178, 108, 165) |
| HSL | hsl(311, 31%, 56%) |
| HSV | hsv(311, 39%, 70%) |
| CMYK | cmyk(0%, 39.3%, 7.3%, 30.2%) |
| CIE-LAB | lab(54.98, 36.43, -18.93) |
| CIE-LCH | lch(54.98, 41.05, 332.54°) |
| OKLab | oklab(62.65% 0.1043 -0.051) |
| OKLCH | oklch(62.65% 0.116 333.9) |
| XYZ | xyz(30.5140, 22.9083, 38.4045) |
| Luminance | 0.2291 (WCAG relative) |
| Temperature | neutral |
| Family | pink |
Colores con nombre más cercanos
Dark Lilac
#9C6DA5
ΔE00 5.19
Soft Purple
#A66FB5
ΔE00 5.41
Purplish Pink
#CE5DAE
ΔE00 5.97
Orchid (survey)
#C875C4
ΔE00 6.64
Pale Magenta
#D767AD
ΔE00 7.02
Faded Purple
#916E99
ΔE00 7.63
Escalas perceptuales
Sombras
Matices
Tonos
OKLCH scale
Armonías de color
complementary
#B26CA5 #6CB279
analogous
#9C6CB2 #B26CA5 #B26C82
triadic
#B26CA5 #A5B26C #6CA5B2
tetradic
#B26CA5 #B29C6C #6CB279 #6C82B2
square
#B26CA5 #B29C6C #6CB279 #6C82B2
split-complementary
#B26CA5 #82B26C #6CB29C
monochromatic
#6B3862 #944D86 #B26CA5 #C794BE #DCBCD6
Accesibilidad y contraste
On white
3.76
#B26CA5 on #FFFFFF
AA ✗AA large ✓AAA ✗
On black
5.58
#B26CA5 on #000000
AA ✓AA large ✓AAA ✗
Mejor color de texto
#000000 on #B26CA5
5.58:1 — WCAG AA (texto normal) cumple
Matriz de contraste
| fg \ bg | ##B26CA5 | #FFFFFF | #000000 | ##000000 |
|---|---|---|---|---|
| ##B26CA5 | 1.00 | 3.76 | 5.58 | 5.58 |
| #FFFFFF | 3.76 | 1.00 | 21.00 | 21.00 |
| #000000 | 5.58 | 21.00 | 1.00 | 1.00 |
| ##000000 | 5.58 | 21.00 | 1.00 | 1.00 |
Vista previa de daltonismo
Protanopia (red-blind)
#6C7DA7
Deuteranopia (green-blind)
#7D87A3
Tritanopia (blue-blind)
#B86F81
Achromatopsia (no color)
#848484
Tokens de diseño y código
CSS
--color: #b26ca5; /* rgb */ color: rgb(178, 108, 165); /* oklch */ color: oklch(62.6% 0.116 333.9);
Tailwind
colors: {
custom: {
50: '#ca97bf',
500: '#b26ca5',
950: '#000000',
},
}SCSS
$custom: #b26ca5; $custom-light: #ca97bf; $custom-dark: #000000;
JSON
{
"hex": "#b26ca5",
"rgb": {
"r": 178,
"g": 108,
"b": 165
},
"hsl": {
"h": 311.143,
"s": 31.25,
"l": 56.078
},
"oklch": {
"l": 0.62645,
"c": 0.11611,
"h": 333.9
},
"luminance": 0.22907
}Semantic roles & 50–950 ramp
primary
#B26CA5
secondary
#AECBB4
accent
#C77460
background
#FCF9FB
surface
#F9F2F7
border
#D2CCD0
text
#130E12
muted
#827E81
Laboratorio de vista previa
Laboratorio de vista previa → · Comprobador de contraste → · Generador de paletas →