Named color · #AA9911
Vegan Villain
Vegan Villain is #AA9911: rgb(170 153 17), hsl(53 82% 37%), oklch(0.677 0.138 101.2). See tints, shades, harmonies, WCAG & APCA contrast, and CSS, Tailwind v4 & SCSS code.
What does Yellow mean? → · Vegan Villain color name →
#AA9911
oklch(0.677 0.138 101.2)
Color conversions
- HEX
- #aa9911
- RGB
- rgb(170 153 17)
- HSL
- hsl(53 82% 37%)
- HWB
- hwb(53 7% 33%)
- OKLCH
- oklch(0.677 0.138 101.2)
- OKLab
- oklab(0.677 -0.027 0.135)
- CIE Lab
- lab(63.19 -2.99 63.29)
- LCH
- lch(63.19 63.36 92.7)
- CMYK
- cmyk(0% 10% 90% 33%)
Tints · Shades · Tones
Tints
- B2A33B
- BAAD56
- C2B86D
- CBC283
- D3CC98
- DCD6AD
- E4E0C1
- EDEBD6
- F6F5EA
Shades
- 93840D
- 7D7009
- 685D06
- 534A04
- 3F3802
- 2D2701
- 1B1700
- 0B0800
- 010100
Tones
- A6972C
- A1953C
- 9D9248
- 999052
- 948D5C
- 908B64
- 8C886C
- 888673
- 84837A
Color harmonies
Complementary +180°
- AA9911
Vegan Villain
- 8A8BEA
≈ Perrywinkle
Analogous -30° +30°
- AA9911
Vegan Villain
- CC871C
≈ Chicken Masala
- 78A847
≈ Greenery
Triadic +120° +240°
- AA9911
Vegan Villain
- 00A8CD
≈ Gummy Dolphins
- CF73B0
≈ Sky Magenta
Split-complementary +150° +210°
- AA9911
Vegan Villain
- 509BE9
≈ Perfect Days
- B37DD5
≈ Lavender Blossom
Tetradic +90° +180° +270°
- AA9911
Vegan Villain
- 00AEA9
≈ Teal Me No Lies
- 8A8BEA
≈ Perrywinkle
- DE7082
≈ Coming up Roses
Contrast & accessibility
Ag
FailOn white
WCAG 2.88:1 · APCA Lc 55
Ag
AAAOn black
WCAG 7.27:1 · APCA Lc 47
Best text color: #000000
WCAG 7.27:1 (AAA) · APCA Lc 47
Contrast pairs
Code snippets
CSS
:root {
--vegan-villain: #aa9911;
--vegan-villain-rgb: 170 153 17;
--vegan-villain-oklch: oklch(0.677 0.138 101.2);
}
.element {
color: var(--vegan-villain);
background-color: hsl(53 82% 37%);
border-color: oklch(0.677 0.138 101.2);
}Tailwind CSS v4
@theme {
--color-vegan-villain: #aa9911;
--color-vegan-villain-50: #fcf8ca;
--color-vegan-villain-100: #f0ebb5;
--color-vegan-villain-200: #ded792;
--color-vegan-villain-300: #c4bb63;
--color-vegan-villain-400: #b0a02d;
--color-vegan-villain-500: #9a8700;
--color-vegan-villain-600: #837200;
--color-vegan-villain-700: #695c00;
--color-vegan-villain-800: #4e4200;
--color-vegan-villain-900: #372e00;
--color-vegan-villain-950: #221a00;
}SCSS
$vegan-villain: #aa9911;
$vegan-villain-rgb: 170, 153, 17;
$vegan-villain-light: mix(#fff, $vegan-villain, 20%);
$vegan-villain-dark: mix(#000, $vegan-villain, 20%);
.element {
color: $vegan-villain;
box-shadow: 0 0 0 2px rgba($vegan-villain, 0.35);
}