Sign Up Sign Up
4-Color Golden Boy Palette

4-Color Golden Boy Palette

4-color palette · Warm · Dark · Analogous harmony

Back to Library

4-Color Golden Boy Palette

4-color palette · Warm temperature · Dark tone · Analogous harmony

Modify
Earthy 4 colors Warm Dark Analogous
Likes 16
Colors 4

CSS variables

:root {
  --c-earthy-1: #FFDE42;
  --c-earthy-2: #4C5C2D;
  --c-earthy-3: #313E17;
  --c-earthy-4: #1B0C0C;
}

About this palette

This 4-color earthy palette runs from Golden Boy (#FFDE42) as its lightest tone to Optophobia (#1B0C0C) as its darkest. It blends Golden Boy, Woodman, Hinterlands Green and Optophobia into a single set you can drop straight into a UI. Of its 6 color pairings, 3 meet the WCAG AA contrast threshold (4.5:1) for body text — the strongest is #FFDE42 on #1B0C0C at 14.29:1.

Grounded, natural tones — suits sustainability/organic brands, coffee shops, outdoor gear, and warm editorial typography.

Color breakdown

Golden Boy #FFDE42
RGB
rgb(255, 222, 66)
HSL
hsl(50, 100%, 63%)
Luminance
0.739
Woodman #4C5C2D
RGB
rgb(76, 92, 45)
HSL
hsl(80, 34%, 27%)
Luminance
0.094
Hinterlands Green #313E17
RGB
rgb(49, 62, 23)
HSL
hsl(80, 46%, 17%)
Luminance
0.042
Optophobia #1B0C0C
RGB
rgb(27, 12, 12)
HSL
hsl(0, 38%, 8%)
Luminance
0.005

Contrast & accessibility

3 of 6 color pairings meet the WCAG AA contrast threshold (4.5:1) for body text.

Aa #FFDE42 on #1B0C0C 14.29:1 AAA
Aa #FFDE42 on #313E17 8.61:1 AAA
Aa #FFDE42 on #4C5C2D 5.49:1 AA
Aa #4C5C2D on #1B0C0C 2.60:1 Fail
Aa #313E17 on #1B0C0C 1.66:1 Fail
Aa #4C5C2D on #313E17 1.57:1 Fail

Similar palettes

#000000 #3D0000 #950101 #FF0000
4 colors
#E23E57 #88304E #522546 #311D3F
4 colors
#FF204E #A0153E #5D0E41 #00224D
4 colors
#030637 #3C0753 #720455 #910A67
4 colors
#1C0A00 #361500 #603601 #CC9544
4 colors
#252525 #FF0000 #AF0404 #414141
4 colors
#362222 #171010 #423F3E #2B2B2B
4 colors
#1A1A1D #3B1C32 #6A1E55 #A64D79
4 colors