#400A2E#400A2E
#400A2E es un color oscuro y moderadamente saturado de la familia rosa. Luminancia relativa 0.015; OKLCH L 25.9% C 0.092 H 344.6°. El mejor color de texto es #FFFFFF con contraste 16.14:1 (cumple WCAG AA).
Valores del color
| HEX | #400A2E |
|---|---|
| RGB | rgb(64, 10, 46) |
| HSL | hsl(320, 73%, 15%) |
| HSV | hsv(320, 84%, 25%) |
| CMYK | cmyk(0%, 84.4%, 28.1%, 74.9%) |
| CIE-LAB | lab(12.64, 29.43, -9.17) |
| CIE-LCH | lch(12.64, 30.82, 342.69°) |
| OKLab | oklab(25.91% 0.089 -0.0244) |
| OKLCH | oklch(25.91% 0.092 344.6) |
| XYZ | xyz(2.7161, 1.5046, 2.7316) |
| Luminance | 0.0150 (WCAG relative) |
| Temperature | warm |
| Family | pink |
Colores con nombre más cercanos
Dark Plum
#3F012C
ΔE00 1.74
Aubergine
#3D0734
ΔE00 3.08
Eggplant
#380835
ΔE00 4.48
Plum (survey)
#580F41
ΔE00 5.49
Eggplant Purple
#430541
ΔE00 6.22
Deep Violet
#490648
ΔE00 7.34
Escalas perceptuales
Sombras
Matices
Tonos
OKLCH scale
Armonías de color
complementary
#400A2E #0A401C
analogous
#370A40 #400A2E #400A13
triadic
#400A2E #2E400A #0A2E40
tetradic
#400A2E #40370A #0A401C #0A1340
square
#400A2E #40370A #0A401C #0A1340
split-complementary
#400A2E #13400A #0A4037
monochromatic
#1A0413 #1A0413 #400A2E #751254 #AA1B7A
Accesibilidad y contraste
On white
16.14
#400A2E on #FFFFFF
AA ✓AA large ✓AAA ✓
On black
1.30
#400A2E on #000000
AA ✗AA large ✗AAA ✗
Mejor color de texto
#FFFFFF on #400A2E
16.14:1 — WCAG AA (texto normal) cumple
Matriz de contraste
| fg \ bg | ##400A2E | #FFFFFF | #000000 | ##FFFFFF |
|---|---|---|---|---|
| ##400A2E | 1.00 | 16.14 | 1.30 | 16.14 |
| #FFFFFF | 16.14 | 1.00 | 21.00 | 1.00 |
| #000000 | 1.30 | 21.00 | 1.00 | 21.00 |
| ##FFFFFF | 16.14 | 1.00 | 21.00 | 1.00 |
Vista previa de daltonismo
Protanopia (red-blind)
#111B2F
Deuteranopia (green-blind)
#21242D
Tritanopia (blue-blind)
#45091B
Achromatopsia (no color)
#212121
Tokens de diseño y código
CSS
--color: #400a2e; /* rgb */ color: rgb(64, 10, 46); /* oklch */ color: oklch(25.9% 0.092 344.6);
Tailwind
colors: {
custom: {
50: '#774f66',
500: '#400a2e',
950: '#000000',
},
}SCSS
$custom: #400a2e; $custom-light: #774f66; $custom-dark: #000000;
JSON
{
"hex": "#400a2e",
"rgb": {
"r": 64,
"g": 10,
"b": 46
},
"hsl": {
"h": 320,
"s": 72.973,
"l": 14.51
},
"oklch": {
"l": 0.25911,
"c": 0.09232,
"h": 344.6
},
"luminance": 0.01504
}Semantic roles & 50–950 ramp
primary
#400A2E
secondary
#297D45
accent
#F07538
background
#F7F4F6
surface
#EDE7EB
border
#C8C3C6
text
#090206
muted
#7B787A
Laboratorio de vista previa
Laboratorio de vista previa → · Comprobador de contraste → · Generador de paletas →