#A67C23#A67C23
#A67C23 es un color medio y moderadamente saturado de la familia naranja. Luminancia relativa 0.226; OKLCH L 61.2% C 0.114 H 81.6°. El mejor color de texto es #000000 con contraste 5.53:1 (cumple WCAG AA).
Valores del color
| HEX | #A67C23 |
|---|---|
| RGB | rgb(166, 124, 35) |
| HSL | hsl(41, 65%, 39%) |
| HSV | hsv(41, 79%, 65%) |
| CMYK | cmyk(0%, 25.3%, 78.9%, 34.9%) |
| CIE-LAB | lab(54.71, 7.89, 51.56) |
| CIE-LCH | lch(54.71, 52.16, 81.30°) |
| OKLab | oklab(61.24% 0.0166 0.1124) |
| OKLCH | oklch(61.24% 0.114 81.6) |
| XYZ | xyz(23.2385, 22.6454, 4.7369) |
| Luminance | 0.2264 (WCAG relative) |
| Temperature | warm |
| Family | orange |
Colores con nombre más cercanos
Bronze (survey)
#A87900
ΔE00 2.56
Mustard Brown
#AC7E04
ΔE00 2.82
Golden Brown
#B27A01
ΔE00 4.02
Yellowish Brown
#9B7A01
ΔE00 4.47
Darkgoldenrod
#B8860B
ΔE00 5.21
Puke Brown
#947706
ΔE00 5.73
Escalas perceptuales
Sombras
Matices
Tonos
OKLCH scale
Armonías de color
complementary
#A67C23 #234DA6
analogous
#A63A23 #A67C23 #8FA623
triadic
#A67C23 #23A67C #7C23A6
tetradic
#A67C23 #23A63A #234DA6 #A6238F
square
#A67C23 #23A63A #234DA6 #A6238F
split-complementary
#A67C23 #238FA6 #3A23A6
monochromatic
#41300E #735618 #A67C23 #D4A032 #DFB865
Accesibilidad y contraste
On white
3.80
#A67C23 on #FFFFFF
AA ✗AA large ✓AAA ✗
On black
5.53
#A67C23 on #000000
AA ✓AA large ✓AAA ✗
Mejor color de texto
#000000 on #A67C23
5.53:1 — WCAG AA (texto normal) cumple
Matriz de contraste
| fg \ bg | ##A67C23 | #FFFFFF | #000000 | ##000000 |
|---|---|---|---|---|
| ##A67C23 | 1.00 | 3.80 | 5.53 | 5.53 |
| #FFFFFF | 3.80 | 1.00 | 21.00 | 21.00 |
| #000000 | 5.53 | 21.00 | 1.00 | 1.00 |
| ##000000 | 5.53 | 21.00 | 1.00 | 1.00 |
Vista previa de daltonismo
Protanopia (red-blind)
#8D7D13
Deuteranopia (green-blind)
#978727
Tritanopia (blue-blind)
#B56F6B
Achromatopsia (no color)
#838383
Tokens de diseño y código
CSS
--color: #a67c23; /* rgb */ color: rgb(166, 124, 35); /* oklch */ color: oklch(61.2% 0.114 81.6);
Tailwind
colors: {
custom: {
50: '#c5a165',
500: '#a67c23',
950: '#000000',
},
}SCSS
$custom: #a67c23; $custom-light: #c5a165; $custom-dark: #000000;
JSON
{
"hex": "#a67c23",
"rgb": {
"r": 166,
"g": 124,
"b": 35
},
"hsl": {
"h": 40.763,
"s": 65.174,
"l": 39.412
},
"oklch": {
"l": 0.61243,
"c": 0.11363,
"h": 81.6
},
"luminance": 0.22644
}Semantic roles & 50–950 ramp
primary
#A67C23
secondary
#6181C4
accent
#76E840
background
#FCF9F6
surface
#F9F2EB
border
#D2CCC6
text
#140E06
muted
#827E7A
Laboratorio de vista previa
Laboratorio de vista previa → · Comprobador de contraste → · Generador de paletas →