#9FDA97#9FDA97
#9FDA97 es un color muy claro y moderadamente saturado de la familia verde. Luminancia relativa 0.597; OKLCH L 83.1% C 0.110 H 141.6°. El mejor color de texto es #000000 con contraste 12.95:1 (cumple WCAG AA).
Valores del color
| HEX | #9FDA97 |
|---|---|
| RGB | rgb(159, 218, 151) |
| HSL | hsl(113, 48%, 72%) |
| HSV | hsv(113, 31%, 85%) |
| CMYK | cmyk(27.1%, 0%, 30.7%, 14.5%) |
| CIE-LAB | lab(81.70, -31.56, 27.10) |
| CIE-LCH | lch(81.70, 41.60, 139.34°) |
| OKLab | oklab(83.11% -0.086 0.0682) |
| OKLCH | oklch(83.11% 0.11 141.6) |
| XYZ | xyz(44.9537, 59.7465, 38.4358) |
| Luminance | 0.5975 (WCAG relative) |
| Temperature | neutral |
| Family | green |
Colores con nombre más cercanos
Light Grey Green
#B7E1A1
ΔE00 3.80
Hospital Green
#9BE5AA
ΔE00 4.03
Light Sage
#BCECAC
ΔE00 5.02
Lightgreen
#90EE90
ΔE00 6.35
Washed Out Green
#BCF5A6
ΔE00 6.52
Pistachio
#93C572
ΔE00 6.62
Escalas perceptuales
Sombras
Matices
Tonos
OKLCH scale
Armonías de color
complementary
#9FDA97 #D297DA
analogous
#C0DA97 #9FDA97 #97DAB1
triadic
#9FDA97 #979FDA #DA979F
tetradic
#9FDA97 #97C0DA #D297DA #DAB197
square
#9FDA97 #97C0DA #D297DA #DAB197
split-complementary
#9FDA97 #B197DA #DA97C0
monochromatic
#4FB641 #75CA6A #9FDA97 #C9EAC4 #EAF7E8
Accesibilidad y contraste
On white
1.62
#9FDA97 on #FFFFFF
AA ✗AA large ✗AAA ✗
On black
12.95
#9FDA97 on #000000
AA ✓AA large ✓AAA ✓
Mejor color de texto
#000000 on #9FDA97
12.95:1 — WCAG AA (texto normal) cumple
Matriz de contraste
| fg \ bg | ##9FDA97 | #FFFFFF | #000000 | ##000000 |
|---|---|---|---|---|
| ##9FDA97 | 1.00 | 1.62 | 12.95 | 12.95 |
| #FFFFFF | 1.62 | 1.00 | 21.00 | 21.00 |
| #000000 | 12.95 | 21.00 | 1.00 | 1.00 |
| ##000000 | 12.95 | 21.00 | 1.00 | 1.00 |
Vista previa de daltonismo
Protanopia (red-blind)
#DECF93
Deuteranopia (green-blind)
#D4C99B
Tritanopia (blue-blind)
#9BD6C8
Achromatopsia (no color)
#CBCBCB
Tokens de diseño y código
CSS
--color: #9fda97; /* rgb */ color: rgb(159, 218, 151); /* oklch */ color: oklch(83.1% 0.110 141.6);
Tailwind
colors: {
custom: {
50: '#bde5b6',
500: '#9fda97',
950: '#000000',
},
}SCSS
$custom: #9fda97; $custom-light: #bde5b6; $custom-dark: #000000;
JSON
{
"hex": "#9fda97",
"rgb": {
"r": 159,
"g": 218,
"b": 151
},
"hsl": {
"h": 112.836,
"s": 47.518,
"l": 72.353
},
"oklch": {
"l": 0.83111,
"c": 0.1098,
"h": 141.6
},
"luminance": 0.59748
}Semantic roles & 50–950 ramp
primary
#9FDA97
secondary
#A864B1
accent
#2BBBAA
background
#FDFEFD
surface
#F8FCF8
border
#D1D5D1
text
#121611
muted
#828481
Laboratorio de vista previa
Laboratorio de vista previa → · Comprobador de contraste → · Generador de paletas →