Named color · #847E54
Xena
Xena is #847E54: rgb(132 126 84), hsl(52 22% 42%), oklch(0.588 0.06 101.1). See tints, shades, harmonies, WCAG & APCA contrast, and CSS, Tailwind v4 & SCSS code.
What does Yellow mean? → · Xena color name →
#847E54
oklch(0.588 0.06 101.1)
Color conversions
- HEX
- #847e54
- RGB
- rgb(132 126 84)
- HSL
- hsl(52 22% 42%)
- HWB
- hwb(52 33% 48%)
- OKLCH
- oklch(0.588 0.06 101.1)
- OKLab
- oklab(0.588 -0.011 0.059)
- CIE Lab
- lab(52.54 -2.63 23.77)
- LCH
- lch(52.54 23.91 96.3)
- CMYK
- cmyk(0% 5% 36% 48%)
Tints · Shades · Tones
Tints
- 908A64
- 9B9775
- A7A385
- B3B096
- C0BDA7
- CCCAB8
- D8D7CA
- E5E4DB
- F2F1ED
Shades
- 726D48
- 605C3C
- 4F4C31
- 3F3C26
- 2F2D1B
- 201F11
- 121108
- 060502
- 010100
Tones
- 847E59
- 837F5E
- 837F62
- 827F67
- 827F6B
- 827F6F
- 818074
- 818078
- 80807C
Color harmonies
Complementary +180°
- 847E54
Xena
- 7679A0
≈ Blue Dove
Analogous -30° +30°
Triadic +120° +240°
Split-complementary +150° +210°
- 847E54
Xena
- 627F9F
≈ Blue Oar
- 887397
≈ Greyish Purple
Tetradic +90° +180° +270°
Contrast & accessibility
Ag
FailOn white
WCAG 4.12:1 · APCA Lc 68
Ag
AAOn black
WCAG 5.09:1 · APCA Lc 33
Best text color: #000000
WCAG 5.09:1 (AA) · APCA Lc 33
Contrast pairs
Code snippets
CSS
:root {
--xena: #847e54;
--xena-rgb: 132 126 84;
--xena-oklch: oklch(0.588 0.06 101.1);
}
.element {
color: var(--xena);
background-color: hsl(52 22% 42%);
border-color: oklch(0.588 0.06 101.1);
}Tailwind CSS v4
@theme {
--color-xena: #847e54;
--color-xena-50: #f8f6e3;
--color-xena-100: #ebe9d3;
--color-xena-200: #d8d6b9;
--color-xena-300: #bcb996;
--color-xena-400: #a6a077;
--color-xena-500: #8e8859;
--color-xena-600: #78734c;
--color-xena-700: #605c3c;
--color-xena-800: #47432a;
--color-xena-900: #312e1d;
--color-xena-950: #1d1b0d;
}SCSS
$xena: #847e54;
$xena-rgb: 132, 126, 84;
$xena-light: mix(#fff, $xena, 20%);
$xena-dark: mix(#000, $xena, 20%);
.element {
color: $xena;
box-shadow: 0 0 0 2px rgba($xena, 0.35);
}