Nearest named color · #A96408
#A96408
Nearest named color: Ginger
#A96408 (rgb(169 100 8), hsl(34 91% 35%), oklch(0.568 0.126 64.1)) is closest to the named color Ginger. See tints, shades, harmonies, WCAG & APCA contrast, and CSS, Tailwind v4 & SCSS code.
#A96408
oklch(0.568 0.126 64.1)
Color conversions
- HEX
- #a96408
- RGB
- rgb(169 100 8)
- HSL
- hsl(34 91% 35%)
- HWB
- hwb(34 3% 34%)
- OKLCH
- oklch(0.568 0.126 64.1)
- OKLab
- oklab(0.568 0.055 0.113)
- CIE Lab
- lab(49.47 24.45 55.36)
- LCH
- lch(49.47 60.52 66.2)
- CMYK
- cmyk(0% 41% 95% 34%)
Tints · Shades · Tones
Tints
- B27331
- BB834B
- C49262
- CDA179
- D6B18F
- DEC0A5
- E7D0BB
- EFDFD2
- F7EFE8
Shades
- 925606
- 7C4804
- 673B03
- 532E02
- 3F2201
- 2C1601
- 1B0B00
- 0A0300
- 010000
Tones
- A56723
- A26B32
- 9E6E3F
- 9A714A
- 967454
- 92765D
- 8E7966
- 897B6F
- 857E78
Color harmonies
Complementary +180°
- A96408
Ginger
- 227DBB
≈ Haddock’s Sweater
Analogous -30° +30°
- A96408
Ginger
- B55742
≈ Autumn Glaze
- 8D7500
≈ Vermin Brown
Triadic +120° +240°
- A96408
Ginger
- 008A7E
≈ Go Go Green
- 8762B3
≈ Lusty Lavender
Split-complementary +150° +210°
- A96408
Ginger
- 00859B
≈ Marker Blue
- 616FC0
≈ Gladiola Blue
Tetradic +90° +180° +270°
Contrast & accessibility
Ag
AAOn white
WCAG 4.65:1 · APCA Lc 72
Ag
AAOn black
WCAG 4.51:1 · APCA Lc 30
Best text color: #FFFFFF
WCAG 4.65:1 (AA) · APCA Lc 72
Contrast pairs
Code snippets
CSS
:root {
--ginger: #a96408;
--ginger-rgb: 169 100 8;
--ginger-oklch: oklch(0.568 0.126 64.1);
}
.element {
color: var(--ginger);
background-color: hsl(34 91% 35%);
border-color: oklch(0.568 0.126 64.1);
}Tailwind CSS v4
@theme {
--color-ginger: #a96408;
--color-ginger-50: #ffefd0;
--color-ginger-100: #ffe0bc;
--color-ginger-200: #faca9b;
--color-ginger-300: #e4aa70;
--color-ginger-400: #d28d47;
--color-ginger-500: #bf7106;
--color-ginger-600: #a1600e;
--color-ginger-700: #814d0c;
--color-ginger-800: #613708;
--color-ginger-900: #442506;
--color-ginger-950: #2c1400;
}SCSS
$ginger: #a96408;
$ginger-rgb: 169, 100, 8;
$ginger-light: mix(#fff, $ginger, 20%);
$ginger-dark: mix(#000, $ginger, 20%);
.element {
color: $ginger;
box-shadow: 0 0 0 2px rgba($ginger, 0.35);
}