#91A4CB#91A4CB
#91A4CB es un color claro y moderadamente saturado de la familia azul. Luminancia relativa 0.369; OKLCH L 71.8% C 0.061 H 264.5°. El mejor color de texto es #000000 con contraste 8.38:1 (cumple WCAG AA).
Valores del color
| HEX | #91A4CB |
|---|---|
| RGB | rgb(145, 164, 203) |
| HSL | hsl(220, 36%, 68%) |
| HSV | hsv(220, 29%, 80%) |
| CMYK | cmyk(28.6%, 19.2%, 0%, 20.4%) |
| CIE-LAB | lab(67.19, 2.29, -22.10) |
| CIE-LCH | lch(67.19, 22.22, 275.90°) |
| OKLab | oklab(71.78% -0.0058 -0.0607) |
| OKLCH | oklch(71.78% 0.061 264.5) |
| XYZ | xyz(35.7290, 36.8813, 61.7246) |
| Luminance | 0.3688 (WCAG relative) |
| Temperature | cool |
| Family | blue |
Colores con nombre más cercanos
Periwinkle Blue
#8F99FB
ΔE00 7.60
Perrywinkle
#8F8CE7
ΔE00 8.92
Pastel Blue
#A2BFFE
ΔE00 8.98
Bluey Grey
#89A0B0
ΔE00 9.35
Carolina Blue
#8AB8FE
ΔE00 9.44
Lightsteelblue
#B0C4DE
ΔE00 9.57
Escalas perceptuales
Sombras
Matices
Tonos
OKLCH scale
Armonías de color
complementary
#91A4CB #CBB891
analogous
#91C1CB #91A4CB #9B91CB
triadic
#91A4CB #CB91A4 #A4CB91
tetradic
#91A4CB #CB91C1 #CBB891 #91CB9B
square
#91A4CB #CB91C1 #CBB891 #91CB9B
split-complementary
#91A4CB #CB9B91 #C1CB91
monochromatic
#486399 #6782B7 #91A4CB #BBC6DF #E4E9F2
Accesibilidad y contraste
On white
2.51
#91A4CB on #FFFFFF
AA ✗AA large ✗AAA ✗
On black
8.38
#91A4CB on #000000
AA ✓AA large ✓AAA ✓
Mejor color de texto
#000000 on #91A4CB
8.38:1 — WCAG AA (texto normal) cumple
Matriz de contraste
| fg \ bg | ##91A4CB | #FFFFFF | #000000 | ##000000 |
|---|---|---|---|---|
| ##91A4CB | 1.00 | 2.51 | 8.38 | 8.38 |
| #FFFFFF | 2.51 | 1.00 | 21.00 | 21.00 |
| #000000 | 8.38 | 21.00 | 1.00 | 1.00 |
| ##000000 | 8.38 | 21.00 | 1.00 | 1.00 |
Vista previa de daltonismo
Protanopia (red-blind)
#97A6CD
Deuteranopia (green-blind)
#92A1CA
Tritanopia (blue-blind)
#81ACB1
Achromatopsia (no color)
#A4A4A4
Tokens de diseño y código
CSS
--color: #91a4cb; /* rgb */ color: rgb(145, 164, 203); /* oklch */ color: oklch(71.8% 0.061 264.5);
Tailwind
colors: {
custom: {
50: '#b2bedb',
500: '#91a4cb',
950: '#000000',
},
}SCSS
$custom: #91a4cb; $custom-light: #b2bedb; $custom-dark: #000000;
JSON
{
"hex": "#91a4cb",
"rgb": {
"r": 145,
"g": 164,
"b": 203
},
"hsl": {
"h": 220.345,
"s": 35.802,
"l": 68.235
},
"oklch": {
"l": 0.71781,
"c": 0.06101,
"h": 264.5
},
"luminance": 0.36882
}Semantic roles & 50–950 ramp
primary
#91A4CB
secondary
#E5DFD3
accent
#8737AF
background
#FBFBFD
surface
#F6F6FA
border
#D0D0D3
text
#111215
muted
#808183
Laboratorio de vista previa
Laboratorio de vista previa → · Comprobador de contraste → · Generador de paletas →