#DADFB1#DADFB1
#DADFB1 es un color muy claro y moderadamente saturado de la familia amarillo. Luminancia relativa 0.709; OKLCH L 88.8% C 0.061 H 112.7°. El mejor color de texto es #000000 con contraste 15.17:1 (cumple WCAG AA).
Valores del color
| HEX | #DADFB1 |
|---|---|
| RGB | rgb(218, 223, 177) |
| HSL | hsl(67, 42%, 78%) |
| HSV | hsv(67, 21%, 87%) |
| CMYK | cmyk(2.2%, 0%, 20.6%, 12.5%) |
| CIE-LAB | lab(87.41, -9.26, 22.04) |
| CIE-LCH | lch(87.41, 23.90, 112.79°) |
| OKLab | oklab(88.82% -0.0235 0.0562) |
| OKLCH | oklch(88.82% 0.061 112.7) |
| XYZ | xyz(63.2364, 70.8556, 51.9316) |
| Luminance | 0.7086 (WCAG relative) |
| Temperature | warm |
| Family | yellow |
Colores con nombre más cercanos
Palegoldenrod
#EEE8AA
ΔE00 5.48
Beige (survey)
#E6DAA6
ΔE00 5.78
Lightgoldenrodyellow
#FAFAD2
ΔE00 6.56
Vanilla
#F3E5AB
ΔE00 6.88
Lemonchiffon
#FFFACD
ΔE00 7.09
Cream
#FFFDD0
ΔE00 7.12
Escalas perceptuales
Sombras
Matices
Tonos
OKLCH scale
Armonías de color
complementary
#DADFB1 #B6B1DF
analogous
#DFCDB1 #DADFB1 #C3DFB1
triadic
#DADFB1 #B1DADF #DFB1DA
tetradic
#DADFB1 #B1DFCD #B6B1DF #DFB1C3
square
#DADFB1 #B1DFCD #B6B1DF #DFB1C3
split-complementary
#DADFB1 #B1C3DF #CDB1DF
monochromatic
#B1BB5A #C5CD86 #DADFB1 #EFF1DC #F5F6E9
Accesibilidad y contraste
On white
1.38
#DADFB1 on #FFFFFF
AA ✗AA large ✗AAA ✗
On black
15.17
#DADFB1 on #000000
AA ✓AA large ✓AAA ✓
Mejor color de texto
#000000 on #DADFB1
15.17:1 — WCAG AA (texto normal) cumple
Matriz de contraste
| fg \ bg | ##DADFB1 | #FFFFFF | #000000 | ##000000 |
|---|---|---|---|---|
| ##DADFB1 | 1.00 | 1.38 | 15.17 | 15.17 |
| #FFFFFF | 1.38 | 1.00 | 21.00 | 21.00 |
| #000000 | 15.17 | 21.00 | 1.00 | 1.00 |
| ##000000 | 15.17 | 21.00 | 1.00 | 1.00 |
Vista previa de daltonismo
Protanopia (red-blind)
#E6DAAE
Deuteranopia (green-blind)
#E6DCB3
Tritanopia (blue-blind)
#E0D9D2
Achromatopsia (no color)
#DBDBDB
Tokens de diseño y código
CSS
--color: #dadfb1; /* rgb */ color: rgb(218, 223, 177); /* oklch */ color: oklch(88.8% 0.061 112.7);
Tailwind
colors: {
custom: {
50: '#e5e9c8',
500: '#dadfb1',
950: '#000000',
},
}SCSS
$custom: #dadfb1; $custom-light: #e5e9c8; $custom-dark: #000000;
JSON
{
"hex": "#dadfb1",
"rgb": {
"r": 218,
"g": 223,
"b": 177
},
"hsl": {
"h": 66.522,
"s": 41.818,
"l": 78.431
},
"oklch": {
"l": 0.8882,
"c": 0.06092,
"h": 112.7
},
"luminance": 0.70855
}Semantic roles & 50–950 ramp
primary
#DADFB1
secondary
#837DB8
accent
#31B53F
background
#FEFEFD
surface
#FCFCF9
border
#D5D5D2
text
#161613
muted
#848482
Laboratorio de vista previa
Laboratorio de vista previa → · Comprobador de contraste → · Generador de paletas →