#AE612C#AE612C
#AE612C is a mid, moderate orange. Relative luminance 0.177; OKLCH L 57.2% C 0.120 H 52.2°. Best body text is #FFFFFF at 4.62:1 contrast (WCAG AA passes).
Color values
| HEX | #AE612C |
|---|---|
| RGB | rgb(174, 97, 44) |
| HSL | hsl(24, 60%, 43%) |
| HSV | hsv(24, 75%, 68%) |
| CMYK | cmyk(0%, 44.3%, 74.7%, 31.8%) |
| CIE-LAB | lab(49.17, 26.96, 42.52) |
| CIE-LCH | lch(49.17, 50.35, 57.63°) |
| OKLab | oklab(57.18% 0.0734 0.0947) |
| OKLCH | oklch(57.18% 0.12 52.2) |
| XYZ | xyz(22.1868, 17.7324, 4.6367) |
| Luminance | 0.1773 (WCAG relative) |
| Temperature | warm |
| Family | orange |
Closest named colors
Copper (survey)
#B66325
ΔE00 2.32
Sienna (survey)
#A9561E
ΔE00 3.55
Earth
#A2653E
ΔE00 4.11
Burnt Siena
#B75203
ΔE00 5.18
Orangish Brown
#B25F03
ΔE00 5.21
Clay Brown
#B2713D
ΔE00 5.44
Perceptual scales
Shades
Tints
Tones
OKLCH scale
Color harmonies
complementary
#AE612C #2C79AE
analogous
#AE2C38 #AE612C #AEA22C
triadic
#AE612C #2CAE61 #612CAE
tetradic
#AE612C #38AE2C #2C79AE #A22CAE
square
#AE612C #38AE2C #2C79AE #A22CAE
split-complementary
#AE612C #2CAEA2 #2C38AE
monochromatic
#4C2B13 #7D4620 #AE612C #D07F47 #DDA178
Accessibility & contrast
On white
4.62
#AE612C on #FFFFFF
AA ✓AA large ✓AAA ✗
On black
4.55
#AE612C on #000000
AA ✓AA large ✓AAA ✗
Best text color
#FFFFFF on #AE612C
4.62:1 — WCAG AA (normal text) passes
Contrast matrix
| fg \ bg | ##AE612C | #FFFFFF | #000000 | ##FFFFFF |
|---|---|---|---|---|
| ##AE612C | 1.00 | 4.62 | 4.55 | 4.62 |
| #FFFFFF | 4.62 | 1.00 | 21.00 | 1.00 |
| #000000 | 4.55 | 21.00 | 1.00 | 21.00 |
| ##FFFFFF | 4.62 | 1.00 | 21.00 | 1.00 |
Color blindness preview
Protanopia (red-blind)
#776A26
Deuteranopia (green-blind)
#8A7C2B
Tritanopia (blue-blind)
#BE5156
Achromatopsia (no color)
#757575
Design tokens & code
CSS
--color: #ae612c; /* rgb */ color: rgb(174, 97, 44); /* oklch */ color: oklch(57.2% 0.120 52.2);
Tailwind
colors: {
custom: {
50: '#cc8e68',
500: '#ae612c',
950: '#000000',
},
}SCSS
$custom: #ae612c; $custom-light: #cc8e68; $custom-dark: #000000;
JSON
{
"hex": "#ae612c",
"rgb": {
"r": 174,
"g": 97,
"b": 44
},
"hsl": {
"h": 24.462,
"s": 59.633,
"l": 42.745
},
"oklch": {
"l": 0.57182,
"c": 0.11981,
"h": 52.2
},
"luminance": 0.1773
}Semantic roles & 50–950 ramp
primary
#AE612C
secondary
#71A3C5
accent
#A2E345
background
#FDF8F6
surface
#FAF0EB
border
#D3CBC6
text
#140C06
muted
#837D7A