#BACA96#BACA96
#BACA96 es un color claro y moderadamente saturado de la familia amarillo verdoso. Luminancia relativa 0.549; OKLCH L 81.4% C 0.072 H 121.9°. El mejor color de texto es #000000 con contraste 11.98:1 (cumple WCAG AA).
Valores del color
| HEX | #BACA96 |
|---|---|
| RGB | rgb(186, 202, 150) |
| HSL | hsl(78, 33%, 69%) |
| HSV | hsv(78, 26%, 79%) |
| CMYK | cmyk(7.9%, 0%, 25.7%, 20.8%) |
| CIE-LAB | lab(78.97, -14.33, 24.22) |
| CIE-LCH | lch(78.97, 28.14, 120.62°) |
| OKLab | oklab(81.36% -0.0381 0.0612) |
| OKLCH | oklch(81.36% 0.072 121.9) |
| XYZ | xyz(46.8747, 54.8822, 36.9721) |
| Luminance | 0.5488 (WCAG relative) |
| Temperature | warm |
| Family | yellow-green |
Colores con nombre más cercanos
Pale Olive
#B9CC81
ΔE00 4.76
Greenish Tan
#BCCB7A
ΔE00 6.02
Tan Green
#A9BE70
ΔE00 6.58
Light Moss Green
#A6C875
ΔE00 6.89
Pale Olive Green
#B1D27B
ΔE00 7.08
Light Grey Green
#B7E1A1
ΔE00 7.14
Escalas perceptuales
Sombras
Matices
Tonos
OKLCH scale
Armonías de color
complementary
#BACA96 #A696CA
analogous
#CAC096 #BACA96 #A0CA96
triadic
#BACA96 #96BACA #CA96BA
tetradic
#BACA96 #96CAC0 #A696CA #CA96A0
square
#BACA96 #96CAC0 #A696CA #CA96A0
split-complementary
#BACA96 #96A0CA #C096CA
monochromatic
#81994D #9FB56D #BACA96 #D5DFBF #EFF3E7
Accesibilidad y contraste
On white
1.75
#BACA96 on #FFFFFF
AA ✗AA large ✗AAA ✗
On black
11.98
#BACA96 on #000000
AA ✓AA large ✓AAA ✓
Mejor color de texto
#000000 on #BACA96
11.98:1 — WCAG AA (texto normal) cumple
Matriz de contraste
| fg \ bg | ##BACA96 | #FFFFFF | #000000 | ##000000 |
|---|---|---|---|---|
| ##BACA96 | 1.00 | 1.75 | 11.98 | 11.98 |
| #FFFFFF | 1.75 | 1.00 | 21.00 | 21.00 |
| #000000 | 11.98 | 21.00 | 1.00 | 1.00 |
| ##000000 | 11.98 | 21.00 | 1.00 | 1.00 |
Vista previa de daltonismo
Protanopia (red-blind)
#D0C493
Deuteranopia (green-blind)
#CEC498
Tritanopia (blue-blind)
#BEC5BC
Achromatopsia (no color)
#C3C3C3
Tokens de diseño y código
CSS
--color: #baca96; /* rgb */ color: rgb(186, 202, 150); /* oklch */ color: oklch(81.4% 0.072 121.9);
Tailwind
colors: {
custom: {
50: '#cfdab5',
500: '#baca96',
950: '#000000',
},
}SCSS
$custom: #baca96; $custom-light: #cfdab5; $custom-dark: #000000;
JSON
{
"hex": "#baca96",
"rgb": {
"r": 186,
"g": 202,
"b": 150
},
"hsl": {
"h": 78.462,
"s": 32.911,
"l": 69.02
},
"oklch": {
"l": 0.81363,
"c": 0.07212,
"h": 121.9
},
"luminance": 0.54882
}Semantic roles & 50–950 ramp
primary
#BACA96
secondary
#77659F
accent
#3AAC5D
background
#FEFEFD
surface
#FBFBF8
border
#D4D4D1
text
#141411
muted
#838381
Laboratorio de vista previa
Laboratorio de vista previa → · Comprobador de contraste → · Generador de paletas →