Sign Up Sign Up
Green + Accent

Green + Accent

8-color palette · Cool · Mixed · Complementary harmony

Back to Library

Green + Accent

8-color palette · Cool temperature · Mixed tone · Complementary harmony

Modify
Earthy 8 colors Cool Mixed Complementary green forest accent
Likes 36
Colors 8

CSS variables

:root {
  --c-earthy-1: #FBF4C4;
  --c-earthy-2: #AAD0A3;
  --c-earthy-3: #95B88F;
  --c-earthy-4: #3E4E47;
  --c-earthy-5: #253A3A;
  --c-earthy-6: #162627;
  --c-earthy-7: #111E1F;
  --c-earthy-8: #F89BB0;
}

About this palette

This 8-color earthy palette runs from Banana Custard (#FBF4C4) as its lightest tone to Black Emerald (#111E1F) as its darkest. It blends Banana Custard, Relaxation Green, Brookview, Deep Mooring, Kōrainando Green, Wet Foliage, Black Emerald and Flower Girl into a single set you can drop straight into a UI. Of its 28 color pairings, 14 meet the WCAG AA contrast threshold (4.5:1) for body text — the strongest is #FBF4C4 on #111E1F at 15.32:1.

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

Color breakdown

Banana Custard #FBF4C4
RGB
rgb(251, 244, 196)
HSL
hsl(52, 87%, 88%)
Luminance
0.892
Relaxation Green #AAD0A3
RGB
rgb(170, 208, 163)
HSL
hsl(111, 32%, 73%)
Luminance
0.563
Brookview #95B88F
RGB
rgb(149, 184, 143)
HSL
hsl(111, 22%, 64%)
Luminance
0.427
Deep Mooring #3E4E47
RGB
rgb(62, 78, 71)
HSL
hsl(154, 11%, 27%)
Luminance
0.069
Kōrainando Green #253A3A
RGB
rgb(37, 58, 58)
HSL
hsl(180, 22%, 19%)
Luminance
0.037
Wet Foliage #162627
RGB
rgb(22, 38, 39)
HSL
hsl(184, 28%, 12%)
Luminance
0.017
Black Emerald #111E1F
RGB
rgb(17, 30, 31)
HSL
hsl(184, 29%, 9%)
Luminance
0.012
Flower Girl #F89BB0
RGB
rgb(248, 155, 176)
HSL
hsl(346, 87%, 79%)
Luminance
0.465

Contrast & accessibility

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

Aa #FBF4C4 on #111E1F 15.32:1 AAA
Aa #FBF4C4 on #162627 14.05:1 AAA
Aa #FBF4C4 on #253A3A 10.80:1 AAA
Aa #AAD0A3 on #111E1F 9.97:1 AAA
Aa #AAD0A3 on #162627 9.15:1 AAA
Aa #111E1F on #F89BB0 8.38:1 AAA
Aa #FBF4C4 on #3E4E47 7.90:1 AAA
Aa #95B88F on #111E1F 7.75:1 AAA
Aa #162627 on #F89BB0 7.69:1 AAA
Aa #95B88F on #162627 7.11:1 AAA
Aa #AAD0A3 on #253A3A 7.03:1 AAA
Aa #253A3A on #F89BB0 5.91:1 AA
Aa #95B88F on #253A3A 5.46:1 AA
Aa #AAD0A3 on #3E4E47 5.14:1 AA
Aa #3E4E47 on #F89BB0 4.32:1 AA Large
Aa #95B88F on #3E4E47 4.00:1 AA Large
Aa #FBF4C4 on #95B88F 1.98:1 Fail
Aa #3E4E47 on #111E1F 1.94:1 Fail
Aa #FBF4C4 on #F89BB0 1.83:1 Fail
Aa #3E4E47 on #162627 1.78:1 Fail
Aa #FBF4C4 on #AAD0A3 1.54:1 Fail
Aa #253A3A on #111E1F 1.42:1 Fail
Aa #3E4E47 on #253A3A 1.37:1 Fail
Aa #253A3A on #162627 1.30:1 Fail
Aa #AAD0A3 on #95B88F 1.29:1 Fail
Aa #AAD0A3 on #F89BB0 1.19:1 Fail
Aa #162627 on #111E1F 1.09:1 Fail
Aa #95B88F on #F89BB0 1.08:1 Fail

Similar palettes

#222831 #393E46 #00ADB5 #EEEEEE
4 colors
#F9F7F7 #DBE2EF #3F72AF #112D4E
4 colors
#1B262C #0F4C75 #3282B8 #BBE1FA
4 colors
#08D9D6 #252A34 #FF2E63 #EAEAEA
4 colors
#27374D #526D82 #9DB2BF #DDE6ED
4 colors
#364F6B #3FC1C9 #F5F5F5 #FC5185
4 colors
#E4F9F5 #30E3CA #11999E #40514E
4 colors
#F0F5F9 #C9D6DF #52616B #1E2022
4 colors