#707CBD#707CBD
#707CBD es un color medio y moderadamente saturado de la familia azul. Luminancia relativa 0.215; OKLCH L 60.4% C 0.100 H 275.0°. El mejor color de texto es #000000 con contraste 5.31:1 (cumple WCAG AA).
Valores del color
| HEX | #707CBD |
|---|---|
| RGB | rgb(112, 124, 189) |
| HSL | hsl(231, 37%, 59%) |
| HSV | hsv(231, 41%, 74%) |
| CMYK | cmyk(40.7%, 34.4%, 0%, 25.9%) |
| CIE-LAB | lab(53.53, 12.21, -35.52) |
| CIE-LCH | lch(53.53, 37.56, 288.98°) |
| OKLab | oklab(60.39% 0.0088 -0.0996) |
| OKLCH | oklch(60.39% 0.1 275) |
| XYZ | xyz(23.0723, 21.5331, 51.0749) |
| Luminance | 0.2153 (WCAG relative) |
| Temperature | cool |
| Family | blue |
Colores con nombre más cercanos
Cornflower Blue
#5170D7
ΔE00 7.49
Faded Blue
#658CBB
ΔE00 7.91
Soft Blue
#6488EA
ΔE00 8.26
Cornflower
#6A79F7
ΔE00 8.26
Perrywinkle
#8F8CE7
ΔE00 8.72
Slate Blue (survey)
#5B7C99
ΔE00 8.78
Escalas perceptuales
Sombras
Matices
Tonos
OKLCH scale
Armonías de color
complementary
#707CBD #BDB170
analogous
#70A3BD #707CBD #8B70BD
triadic
#707CBD #BD707C #7CBD70
tetradic
#707CBD #BD70A3 #BDB170 #70BD8B
square
#707CBD #BD70A3 #BDB170 #70BD8B
split-complementary
#707CBD #BD8B70 #A3BD70
monochromatic
#38437A #4C59A4 #707CBD #9AA2D0 #C4C9E4
Accesibilidad y contraste
On white
3.96
#707CBD on #FFFFFF
AA ✗AA large ✓AAA ✗
On black
5.31
#707CBD on #000000
AA ✓AA large ✓AAA ✗
Mejor color de texto
#000000 on #707CBD
5.31:1 — WCAG AA (texto normal) cumple
Matriz de contraste
| fg \ bg | ##707CBD | #FFFFFF | #000000 | ##000000 |
|---|---|---|---|---|
| ##707CBD | 1.00 | 3.96 | 5.31 | 5.31 |
| #FFFFFF | 3.96 | 1.00 | 21.00 | 21.00 |
| #000000 | 5.31 | 21.00 | 1.00 | 1.00 |
| ##000000 | 5.31 | 21.00 | 1.00 | 1.00 |
Vista previa de daltonismo
Protanopia (red-blind)
#6683C0
Deuteranopia (green-blind)
#607DBB
Tritanopia (blue-blind)
#588994
Achromatopsia (no color)
#808080
Tokens de diseño y código
CSS
--color: #707cbd; /* rgb */ color: rgb(112, 124, 189); /* oklch */ color: oklch(60.4% 0.100 275.0);
Tailwind
colors: {
custom: {
50: '#9ca1d1',
500: '#707cbd',
950: '#000000',
},
}SCSS
$custom: #707cbd; $custom-light: #9ca1d1; $custom-dark: #000000;
JSON
{
"hex": "#707cbd",
"rgb": {
"r": 112,
"g": 124,
"b": 189
},
"hsl": {
"h": 230.649,
"s": 36.842,
"l": 59.02
},
"oklch": {
"l": 0.60386,
"c": 0.09996,
"h": 275
},
"luminance": 0.21534
}Semantic roles & 50–950 ramp
primary
#707CBD
secondary
#D4CFB5
accent
#BB5BCD
background
#F9F9FC
surface
#F2F2F9
border
#CCCCD2
text
#0E0F14
muted
#7E7E82
Laboratorio de vista previa
Laboratorio de vista previa → · Comprobador de contraste → · Generador de paletas →