Named color · #5A3532
Arresting Auburn
Arresting Auburn is #5A3532: rgb(90 53 50), hsl(5 29% 27%), oklch(0.373 0.054 25). See tints, shades, harmonies, WCAG & APCA contrast, and CSS, Tailwind v4 & SCSS code.
What does Brown mean? → · Arresting Auburn color name →
#5A3532
oklch(0.373 0.054 25)
Color conversions
- HEX
- #5a3532
- RGB
- rgb(90 53 50)
- HSL
- hsl(5 29% 27%)
- HWB
- hwb(5 20% 65%)
- OKLCH
- oklch(0.373 0.054 25)
- OKLab
- oklab(0.373 0.049 0.023)
- CIE Lab
- lab(26.79 16.78 9.3)
- LCH
- lch(26.79 19.18 29)
- CMYK
- cmyk(0% 41% 44% 65%)
Tints · Shades · Tones
Tints
- 6A4744
- 7A5A56
- 8A6D6A
- 9A807E
- AB9492
- BBA9A7
- CCBEBC
- DDD3D2
- EEE9E8
Shades
- 4D2D2A
- 412522
- 351D1B
- 291514
- 1E0E0D
- 130807
- 090303
- 030101
- 000000
Tones
- 5E3C39
- 624441
- 664B48
- 6A5250
- 6E5A58
- 726160
- 766968
- 797170
- 7D7878
Color harmonies
Complementary +180°
- 5A3532
Arresting Auburn
- 15494E
≈ Sherpa Blue
Analogous -30° +30°
- 5A3532
Arresting Auburn
- 573442
≈ Blackberry Tart
- 573924
≈ Kuro Brown
Triadic +120° +240°
- 5A3532
Arresting Auburn
- 2E482F
≈ Palm Leaf
- 32405D
≈ Gulf Blue
Split-complementary +150° +210°
- 5A3532
Arresting Auburn
- 1C4A3F
≈ Country Squire
- 214559
≈ Astronaut Blue
Tetradic +90° +180° +270°
- 5A3532
Arresting Auburn
- 404421
≈ Avocado Dark Green
- 15494E
≈ Sherpa Blue
- 433B5A
≈ Purple Velvet
Contrast & accessibility
Ag
AAAOn white
WCAG 10.55:1 · APCA Lc 94
Ag
FailOn black
WCAG 1.99:1 · APCA Lc 8
Best text color: #FFFFFF
WCAG 10.55:1 (AAA) · APCA Lc 94
Contrast pairs
Code snippets
CSS
:root {
--arresting-auburn: #5a3532;
--arresting-auburn-rgb: 90 53 50;
--arresting-auburn-oklch: oklch(0.373 0.054 25);
}
.element {
color: var(--arresting-auburn);
background-color: hsl(5 29% 27%);
border-color: oklch(0.373 0.054 25);
}Tailwind CSS v4
@theme {
--color-arresting-auburn: #5a3532;
--color-arresting-auburn-50: #fff0ed;
--color-arresting-auburn-100: #fae2de;
--color-arresting-auburn-200: #ebccc8;
--color-arresting-auburn-300: #d2ada9;
--color-arresting-auburn-400: #bc938e;
--color-arresting-auburn-500: #a77974;
--color-arresting-auburn-600: #8d6662;
--color-arresting-auburn-700: #71524f;
--color-arresting-auburn-800: #543b3a;
--color-arresting-auburn-900: #3a2927;
--color-arresting-auburn-950: #241616;
}SCSS
$arresting-auburn: #5a3532;
$arresting-auburn-rgb: 90, 53, 50;
$arresting-auburn-light: mix(#fff, $arresting-auburn, 20%);
$arresting-auburn-dark: mix(#000, $arresting-auburn, 20%);
.element {
color: $arresting-auburn;
box-shadow: 0 0 0 2px rgba($arresting-auburn, 0.35);
}