Named color · #BDD043
Golden Foliage
Golden Foliage is #BDD043: rgb(189 208 67), hsl(68 60% 54%), oklch(0.817 0.163 116.8). See tints, shades, harmonies, WCAG & APCA contrast, and CSS, Tailwind v4 & SCSS code.
What does Yellow mean? → · Golden Foliage color name →
#BDD043
oklch(0.817 0.163 116.8)
Color conversions
- HEX
- #bdd043
- RGB
- rgb(189 208 67)
- HSL
- hsl(68 60% 54%)
- HWB
- hwb(68 26% 18%)
- OKLCH
- oklch(0.817 0.163 116.8)
- OKLab
- oklab(0.817 -0.073 0.145)
- CIE Lab
- lab(80.11 -19.99 64.04)
- LCH
- lch(80.11 67.09 107.3)
- CMYK
- cmyk(9% 0% 68% 18%)
Tints · Shades · Tones
Tints
- C3D55D
- C9DA73
- D0DF86
- D6E499
- DDE9AB
- E3EDBC
- EAF2CD
- F1F6DE
- F8FBEE
Shades
- A4B539
- 8C9A2F
- 748026
- 5D671D
- 474F14
- 33390C
- 1F2305
- 0D1001
- 020200
Tones
- B7C84F
- B0C059
- AAB860
- A4B067
- 9DA86D
- 97A072
- 919876
- 8B907A
- 86887D
Color harmonies
Complementary +180°
- BDD043
Golden Foliage
- CAB5FF
≈ Violet Heaven
Analogous -30° +30°
- BDD043
Golden Foliage
- F1BB1B
≈ Drippy Honey
- 74DF82
≈ Pastel Green
Triadic +120° +240°
- BDD043
Golden Foliage
- 7DCEFF
≈ Bubbly Barracuda
- FFA4C5
≈ Taffy Pink
Split-complementary +150° +210°
- BDD043
Golden Foliage
- A9C2FF
≈ Pastel Blue
- FA9BFA
≈ Pinkalicious
Tetradic +90° +180° +270°
- BDD043
Golden Foliage
- 00DCF1
≈ Tamarama
- CAB5FF
≈ Violet Heaven
- FFAAA0
≈ Poised Peach
Contrast & accessibility
Ag
FailOn white
WCAG 1.71:1 · APCA Lc 31
Ag
AAAOn black
WCAG 12.26:1 · APCA Lc 72
Best text color: #000000
WCAG 12.26:1 (AAA) · APCA Lc 72
Contrast pairs
Code snippets
CSS
:root {
--golden-foliage: #bdd043;
--golden-foliage-rgb: 189 208 67;
--golden-foliage-oklch: oklch(0.817 0.163 116.8);
}
.element {
color: var(--golden-foliage);
background-color: hsl(68 60% 54%);
border-color: oklch(0.817 0.163 116.8);
}Tailwind CSS v4
@theme {
--color-golden-foliage: #bdd043;
--color-golden-foliage-50: #f0fcc8;
--color-golden-foliage-100: #e2f0b3;
--color-golden-foliage-200: #cdde8e;
--color-golden-foliage-300: #afc35d;
--color-golden-foliage-400: #99aa1a;
--color-golden-foliage-500: #819200;
--color-golden-foliage-600: #6d7b00;
--color-golden-foliage-700: #576300;
--color-golden-foliage-800: #424800;
--color-golden-foliage-900: #2d3200;
--color-golden-foliage-950: #1a1d00;
}SCSS
$golden-foliage: #bdd043;
$golden-foliage-rgb: 189, 208, 67;
$golden-foliage-light: mix(#fff, $golden-foliage, 20%);
$golden-foliage-dark: mix(#000, $golden-foliage, 20%);
.element {
color: $golden-foliage;
box-shadow: 0 0 0 2px rgba($golden-foliage, 0.35);
}