#FDC1B2#FDC1B2
#FDC1B2 es un color muy claro y moderadamente saturado de la familia rojo. Luminancia relativa 0.622; OKLCH L 86.1% C 0.073 H 34.4°. El mejor color de texto es #000000 con contraste 13.45:1 (cumple WCAG AA).
Valores del color
| HEX | #FDC1B2 |
|---|---|
| RGB | rgb(253, 193, 178) |
| HSL | hsl(12, 95%, 85%) |
| HSV | hsv(12, 30%, 99%) |
| CMYK | cmyk(0%, 23.7%, 29.6%, 0.8%) |
| CIE-LAB | lab(83.04, 19.45, 15.88) |
| CIE-LCH | lch(83.04, 25.11, 39.24°) |
| OKLab | oklab(86.12% 0.0598 0.041) |
| OKLCH | oklch(86.12% 0.073 34.4) |
| XYZ | xyz(67.6153, 62.2404, 50.5630) |
| Luminance | 0.6224 (WCAG relative) |
| Temperature | warm |
| Family | red |
Colores con nombre más cercanos
Pale Salmon
#FFB19A
ΔE00 5.05
Light Salmon
#FEA993
ΔE00 6.69
Pale Rose
#FDC1C5
ΔE00 7.33
Apricot
#FBCEB1
ΔE00 7.90
Light Rose
#FFC5CB
ΔE00 8.16
Blush (survey)
#F29E8E
ΔE00 8.63
Escalas perceptuales
Sombras
Matices
Tonos
OKLCH scale
Armonías de color
complementary
#FDC1B2 #B2EEFD
analogous
#FDB2C9 #FDC1B2 #FDE7B2
triadic
#FDC1B2 #B2FDC1 #C1B2FD
tetradic
#FDC1B2 #C9FDB2 #B2EEFD #E7B2FD
square
#FDC1B2 #C9FDB2 #B2EEFD #E7B2FD
split-complementary
#FDC1B2 #B2FDE7 #B2C9FD
monochromatic
#FA613B #FB9176 #FDC1B2 #FEE7E1 #FEE7E1
Accesibilidad y contraste
On white
1.56
#FDC1B2 on #FFFFFF
AA ✗AA large ✗AAA ✗
On black
13.45
#FDC1B2 on #000000
AA ✓AA large ✓AAA ✓
Mejor color de texto
#000000 on #FDC1B2
13.45:1 — WCAG AA (texto normal) cumple
Matriz de contraste
| fg \ bg | ##FDC1B2 | #FFFFFF | #000000 | ##000000 |
|---|---|---|---|---|
| ##FDC1B2 | 1.00 | 1.56 | 13.45 | 13.45 |
| #FFFFFF | 1.56 | 1.00 | 21.00 | 21.00 |
| #000000 | 13.45 | 21.00 | 1.00 | 1.00 |
| ##000000 | 13.45 | 21.00 | 1.00 | 1.00 |
Vista previa de daltonismo
Protanopia (red-blind)
#CEC8B1
Deuteranopia (green-blind)
#DCD3B2
Tritanopia (blue-blind)
#FFB9BD
Achromatopsia (no color)
#CFCFCF
Tokens de diseño y código
CSS
--color: #fdc1b2; /* rgb */ color: rgb(253, 193, 178); /* oklch */ color: oklch(86.1% 0.073 34.4);
Tailwind
colors: {
custom: {
50: '#ffd4c9',
500: '#fdc1b2',
950: '#000000',
},
}SCSS
$custom: #fdc1b2; $custom-light: #ffd4c9; $custom-dark: #000000;
JSON
{
"hex": "#fdc1b2",
"rgb": {
"r": 253,
"g": 193,
"b": 178
},
"hsl": {
"h": 12,
"s": 94.937,
"l": 84.51
},
"oklch": {
"l": 0.86116,
"c": 0.07252,
"h": 34.4
},
"luminance": 0.62237
}Semantic roles & 50–950 ramp
primary
#FDC1B2
secondary
#71CCE2
accent
#B8E600
background
#FFFEFD
surface
#FFFBF9
border
#D7D4D2
text
#181413
muted
#868382
Laboratorio de vista previa
Laboratorio de vista previa → · Comprobador de contraste → · Generador de paletas →