Named color · #BAA208
Snakebite Leather
Snakebite Leather is #BAA208: rgb(186 162 8), hsl(52 92% 38%), oklch(0.712 0.146 98.4). See tints, shades, harmonies, WCAG & APCA contrast, and CSS, Tailwind v4 & SCSS code.
What does Yellow mean? → · Snakebite Leather color name →
#BAA208
oklch(0.712 0.146 98.4)
Color conversions
- HEX
- #baa208
- RGB
- rgb(186 162 8)
- HSL
- hsl(52 92% 38%)
- HWB
- hwb(52 3% 27%)
- OKLCH
- oklch(0.712 0.146 98.4)
- OKLab
- oklab(0.712 -0.021 0.144)
- CIE Lab
- lab(67.16 -0.55 68.3)
- LCH
- lch(67.16 68.3 90.5)
- CMYK
- cmyk(0% 13% 96% 27%)
Tints · Shades · Tones
Tints
- C1AB3B
- C7B557
- CEBE6F
- D5C885
- DCD19A
- E3DAAE
- EAE3C3
- F1EDD7
- F8F6EB
Shades
- A18C06
- 897704
- 726303
- 5C4F02
- 463C01
- 322A01
- 1E1900
- 0D0A00
- 020100
Tones
- B49F2B
- AE9C3C
- A89849
- A29554
- 9C925D
- 968E65
- 918B6D
- 8B8774
- 86847A
Color harmonies
Complementary +180°
- BAA208
Snakebite Leather
- 8E97FB
≈ Periwinkle Blue
Analogous -30° +30°
- BAA208
Snakebite Leather
- DC8E22
≈ Turmeric Tea
- 87B347
≈ Savoy
Triadic +120° +240°
- BAA208
Snakebite Leather
- 00B4D7
≈ Ocean Sigh
- DC7BC1
≈ Fuchsia Blush
Split-complementary +150° +210°
- BAA208
Snakebite Leather
- 4EA8F8
≈ Joust Blue
- BC87E7
≈ Luminous Lavender
Tetradic +90° +180° +270°
- BAA208
Snakebite Leather
- 00BAB1
≈ Turquoise Topaz
- 8E97FB
≈ Periwinkle Blue
- ED7890
≈ So Charming
Contrast & accessibility
Ag
FailOn white
WCAG 2.54:1 · APCA Lc 50
Ag
AAAOn black
WCAG 8.25:1 · APCA Lc 52
Best text color: #000000
WCAG 8.25:1 (AAA) · APCA Lc 52
Contrast pairs
Code snippets
CSS
:root {
--snakebite-leather: #baa208;
--snakebite-leather-rgb: 186 162 8;
--snakebite-leather-oklch: oklch(0.712 0.146 98.4);
}
.element {
color: var(--snakebite-leather);
background-color: hsl(52 92% 38%);
border-color: oklch(0.712 0.146 98.4);
}Tailwind CSS v4
@theme {
--color-snakebite-leather: #baa208;
--color-snakebite-leather-50: #fef7c7;
--color-snakebite-leather-100: #f2eab2;
--color-snakebite-leather-200: #e2d68c;
--color-snakebite-leather-300: #c8b95b;
--color-snakebite-leather-400: #b59e1b;
--color-snakebite-leather-500: #a08500;
--color-snakebite-leather-600: #877100;
--color-snakebite-leather-700: #6c5a00;
--color-snakebite-leather-800: #514100;
--color-snakebite-leather-900: #392d00;
--color-snakebite-leather-950: #231a00;
}SCSS
$snakebite-leather: #baa208;
$snakebite-leather-rgb: 186, 162, 8;
$snakebite-leather-light: mix(#fff, $snakebite-leather, 20%);
$snakebite-leather-dark: mix(#000, $snakebite-leather, 20%);
.element {
color: $snakebite-leather;
box-shadow: 0 0 0 2px rgba($snakebite-leather, 0.35);
}