#D2AB97#D2AB97
#D2AB97 es un color claro y apagado de la familia naranja. Luminancia relativa 0.451; OKLCH L 77.1% C 0.054 H 48.6°. El mejor color de texto es #000000 con contraste 10.01:1 (cumple WCAG AA).
Valores del color
| HEX | #D2AB97 |
|---|---|
| RGB | rgb(210, 171, 151) |
| HSL | hsl(20, 40%, 71%) |
| HSV | hsv(20, 28%, 82%) |
| CMYK | cmyk(0%, 18.6%, 28.1%, 17.6%) |
| CIE-LAB | lab(72.93, 11.29, 15.67) |
| CIE-LCH | lch(72.93, 19.31, 54.23°) |
| OKLab | oklab(77.09% 0.0355 0.0403) |
| OKLCH | oklch(77.09% 0.054 48.6) |
| XYZ | xyz(46.7279, 45.0638, 35.5090) |
| Luminance | 0.4506 (WCAG relative) |
| Temperature | warm |
| Family | orange |
Colores con nombre más cercanos
Mushroom
#BA9E88
ΔE00 6.23
Pinkish Tan
#D99B82
ΔE00 6.45
Pinkish Grey
#C8ACA9
ΔE00 7.34
Tan
#D2B48C
ΔE00 9.32
Apricot
#FBCEB1
ΔE00 9.48
Pale Salmon
#FFB19A
ΔE00 9.66
Escalas perceptuales
Sombras
Matices
Tonos
OKLCH scale
Armonías de color
complementary
#D2AB97 #97BED2
analogous
#D297A0 #D2AB97 #D2C897
triadic
#D2AB97 #97D2AB #AB97D2
tetradic
#D2AB97 #A0D297 #97BED2 #C897D2
square
#D2AB97 #A0D297 #97BED2 #C897D2
split-complementary
#D2AB97 #97D2C8 #97A0D2
monochromatic
#A76848 #C0886C #D2AB97 #E4CEC2 #F6EEEA
Accesibilidad y contraste
On white
2.10
#D2AB97 on #FFFFFF
AA ✗AA large ✗AAA ✗
On black
10.01
#D2AB97 on #000000
AA ✓AA large ✓AAA ✓
Mejor color de texto
#000000 on #D2AB97
10.01:1 — WCAG AA (texto normal) cumple
Matriz de contraste
| fg \ bg | ##D2AB97 | #FFFFFF | #000000 | ##000000 |
|---|---|---|---|---|
| ##D2AB97 | 1.00 | 2.10 | 10.01 | 10.01 |
| #FFFFFF | 2.10 | 1.00 | 21.00 | 21.00 |
| #000000 | 10.01 | 21.00 | 1.00 | 1.00 |
| ##000000 | 10.01 | 21.00 | 1.00 | 1.00 |
Vista previa de daltonismo
Protanopia (red-blind)
#B5AE96
Deuteranopia (green-blind)
#BEB697
Tritanopia (blue-blind)
#DDA5A5
Achromatopsia (no color)
#B3B3B3
Tokens de diseño y código
CSS
--color: #d2ab97; /* rgb */ color: rgb(210, 171, 151); /* oklch */ color: oklch(77.1% 0.054 48.6);
Tailwind
colors: {
custom: {
50: '#e0c4b5',
500: '#d2ab97',
950: '#000000',
},
}SCSS
$custom: #d2ab97; $custom-light: #e0c4b5; $custom-dark: #000000;
JSON
{
"hex": "#d2ab97",
"rgb": {
"r": 210,
"g": 171,
"b": 151
},
"hsl": {
"h": 20.339,
"s": 39.597,
"l": 70.784
},
"oklch": {
"l": 0.77093,
"c": 0.05372,
"h": 48.6
},
"luminance": 0.45062
}Semantic roles & 50–950 ramp
primary
#D2AB97
secondary
#DAE5EA
accent
#87B333
background
#FDFCFB
surface
#FBF8F6
border
#D4D1D0
text
#151211
muted
#838180
Laboratorio de vista previa
Laboratorio de vista previa → · Comprobador de contraste → · Generador de paletas →