#B2EFB5#B2EFB5
#B2EFB5 es un color muy claro y moderadamente saturado de la familia verde. Luminancia relativa 0.745; OKLCH L 89.6% C 0.100 H 145.9°. El mejor color de texto es #000000 con contraste 15.91:1 (cumple WCAG AA).
Valores del color
| HEX | #B2EFB5 |
|---|---|
| RGB | rgb(178, 239, 181) |
| HSL | hsl(123, 66%, 82%) |
| HSV | hsv(123, 26%, 94%) |
| CMYK | cmyk(25.5%, 0%, 24.3%, 6.3%) |
| CIE-LAB | lab(89.17, -30.30, 21.99) |
| CIE-LCH | lch(89.17, 37.44, 144.02°) |
| OKLab | oklab(89.59% -0.0828 0.0561) |
| OKLCH | oklch(89.59% 0.1 145.9) |
| XYZ | xyz(57.5646, 74.5321, 55.0603) |
| Luminance | 0.7453 (WCAG relative) |
| Temperature | neutral |
| Family | green |
Colores con nombre más cercanos
Light Sage
#BCECAC
ΔE00 2.99
Mint
#AAF0C1
ΔE00 3.38
Hospital Green
#9BE5AA
ΔE00 3.38
Light Mint
#B6FFBB
ΔE00 3.66
Celadon
#BEFDB7
ΔE00 3.67
Light Mint Green
#A6FBB2
ΔE00 4.14
Escalas perceptuales
Sombras
Matices
Tonos
OKLCH scale
Armonías de color
complementary
#B2EFB5 #EFB2EC
analogous
#CEEFB2 #B2EFB5 #B2EFD4
triadic
#B2EFB5 #B5B2EF #EFB5B2
tetradic
#B2EFB5 #B2CEEF #EFB2EC #EFD4B2
square
#B2EFB5 #B2CEEF #EFB2EC #EFD4B2
split-complementary
#B2EFB5 #D4B2EF #EFB2CE
monochromatic
#4DDA54 #7FE484 #B2EFB5 #E5FAE6 #E6FAE7
Accesibilidad y contraste
On white
1.32
#B2EFB5 on #FFFFFF
AA ✗AA large ✗AAA ✗
On black
15.91
#B2EFB5 on #000000
AA ✓AA large ✓AAA ✓
Mejor color de texto
#000000 on #B2EFB5
15.91:1 — WCAG AA (texto normal) cumple
Matriz de contraste
| fg \ bg | ##B2EFB5 | #FFFFFF | #000000 | ##000000 |
|---|---|---|---|---|
| ##B2EFB5 | 1.00 | 1.32 | 15.91 | 15.91 |
| #FFFFFF | 1.32 | 1.00 | 21.00 | 21.00 |
| #000000 | 15.91 | 21.00 | 1.00 | 1.00 |
| ##000000 | 15.91 | 21.00 | 1.00 | 1.00 |
Vista previa de daltonismo
Protanopia (red-blind)
#F1E4B2
Deuteranopia (green-blind)
#E7DEB8
Tritanopia (blue-blind)
#ACECDF
Achromatopsia (no color)
#E0E0E0
Tokens de diseño y código
CSS
--color: #b2efb5; /* rgb */ color: rgb(178, 239, 181); /* oklch */ color: oklch(89.6% 0.100 145.9);
Tailwind
colors: {
custom: {
50: '#caf4cb',
500: '#b2efb5',
950: '#000000',
},
}SCSS
$custom: #b2efb5; $custom-light: #caf4cb; $custom-dark: #000000;
JSON
{
"hex": "#b2efb5",
"rgb": {
"r": 178,
"g": 239,
"b": 181
},
"hsl": {
"h": 122.951,
"s": 65.591,
"l": 81.765
},
"oklch": {
"l": 0.89587,
"c": 0.10004,
"h": 145.9
},
"luminance": 0.74534
}Semantic roles & 50–950 ramp
primary
#B2EFB5
secondary
#CD78C9
accent
#18C5CD
background
#FEFFFD
surface
#FAFEF9
border
#D3D6D2
text
#131713
muted
#838582
Laboratorio de vista previa
Laboratorio de vista previa → · Comprobador de contraste → · Generador de paletas →