Sign Up Sign Up
Fadedpage12

Fadedpage12

12-color palette · Warm · Mixed · Analogous harmony

Back to Library

Fadedpage12

12-color palette · Warm temperature · Mixed tone · Analogous harmony

Modify
Earthy 12 colors Warm Mixed Analogous warm soft old page
Likes 90
Colors 12

CSS variables

:root {
  --c-earthy-1: #F7E5C8;
  --c-earthy-2: #E0C092;
  --c-earthy-3: #B88563;
  --c-earthy-4: #91554A;
  --c-earthy-5: #6E3838;
  --c-earthy-6: #42282E;
  --c-earthy-7: #80596F;
  --c-earthy-8: #6C7D8D;
  --c-earthy-9: #90A05E;
  --c-earthy-10: #C27070;
  --c-earthy-11: #D9A470;
  --c-earthy-12: #EAD874;
}

About this palette

This 12-color earthy palette runs from Golden Buff (#F7E5C8) as its lightest tone to Wenge Black (#42282E) as its darkest. It blends Golden Buff, Dirty Blonde, Cognac Brown, Cogswell Cedar, Red Theatre, Wenge Black, Euphoric Magenta, Slate Expectations, Zesty Apple, Art House Pink, Western Sunrise and Golden Glitter Storm into a single set you can drop straight into a UI. Of its 66 color pairings, 10 meet the WCAG AA contrast threshold (4.5:1) for body text — the strongest is #F7E5C8 on #42282E at 10.79:1.

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

Color breakdown

Golden Buff #F7E5C8
RGB
rgb(247, 229, 200)
HSL
hsl(37, 75%, 88%)
Luminance
0.800
Dirty Blonde #E0C092
RGB
rgb(224, 192, 146)
HSL
hsl(35, 56%, 73%)
Luminance
0.556
Cognac Brown #B88563
RGB
rgb(184, 133, 99)
HSL
hsl(24, 37%, 55%)
Luminance
0.279
Cogswell Cedar #91554A
RGB
rgb(145, 85, 74)
HSL
hsl(9, 32%, 43%)
Luminance
0.130
Red Theatre #6E3838
RGB
rgb(110, 56, 56)
HSL
hsl(0, 33%, 33%)
Luminance
0.064
Wenge Black #42282E
RGB
rgb(66, 40, 46)
HSL
hsl(346, 25%, 21%)
Luminance
0.029
Euphoric Magenta #80596F
RGB
rgb(128, 89, 111)
HSL
hsl(326, 18%, 43%)
Luminance
0.129
Slate Expectations #6C7D8D
RGB
rgb(108, 125, 141)
HSL
hsl(209, 13%, 49%)
Luminance
0.198
Zesty Apple #90A05E
RGB
rgb(144, 160, 94)
HSL
hsl(75, 26%, 50%)
Luminance
0.319
Art House Pink #C27070
RGB
rgb(194, 112, 112)
HSL
hsl(0, 40%, 60%)
Luminance
0.242
Western Sunrise #D9A470
RGB
rgb(217, 164, 112)
HSL
hsl(30, 58%, 65%)
Luminance
0.425
Golden Glitter Storm #EAD874
RGB
rgb(234, 216, 116)
HSL
hsl(51, 74%, 69%)
Luminance
0.679

Contrast & accessibility

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

Aa #F7E5C8 on #42282E 10.79:1 AAA
Aa #42282E on #EAD874 9.25:1 AAA
Aa #E0C092 on #42282E 7.70:1 AAA
Aa #F7E5C8 on #6E3838 7.44:1 AAA
Aa #6E3838 on #EAD874 6.38:1 AA
Aa #42282E on #D9A470 6.03:1 AA
Aa #E0C092 on #6E3838 5.30:1 AA
Aa #F7E5C8 on #80596F 4.75:1 AA
Aa #F7E5C8 on #91554A 4.72:1 AA
Aa #42282E on #90A05E 4.68:1 AA
Aa #B88563 on #42282E 4.17:1 AA Large
Aa #6E3838 on #D9A470 4.15:1 AA Large
Aa #80596F on #EAD874 4.07:1 AA Large
Aa #91554A on #EAD874 4.05:1 AA Large
Aa #42282E on #C27070 3.71:1 AA Large
Aa #F7E5C8 on #6C7D8D 3.43:1 AA Large
Aa #E0C092 on #80596F 3.39:1 AA Large
Aa #E0C092 on #91554A 3.37:1 AA Large
Aa #6E3838 on #90A05E 3.23:1 AA Large
Aa #42282E on #6C7D8D 3.15:1 AA Large
Aa #6C7D8D on #EAD874 2.94:1 Fail
Aa #F7E5C8 on #C27070 2.91:1 Fail
Aa #B88563 on #6E3838 2.88:1 Fail
Aa #80596F on #D9A470 2.65:1 Fail
Aa #91554A on #D9A470 2.64:1 Fail
Aa #F7E5C8 on #B88563 2.59:1 Fail
Aa #6E3838 on #C27070 2.56:1 Fail
Aa #C27070 on #EAD874 2.49:1 Fail
Aa #E0C092 on #6C7D8D 2.45:1 Fail
Aa #F7E5C8 on #90A05E 2.30:1 Fail
Aa #91554A on #42282E 2.29:1 Fail
Aa #42282E on #80596F 2.27:1 Fail
Aa #B88563 on #EAD874 2.22:1 Fail
Aa #6E3838 on #6C7D8D 2.17:1 Fail
Aa #E0C092 on #C27070 2.07:1 Fail
Aa #80596F on #90A05E 2.06:1 Fail
Aa #91554A on #90A05E 2.05:1 Fail
Aa #90A05E on #EAD874 1.98:1 Fail
Aa #6C7D8D on #D9A470 1.92:1 Fail
Aa #E0C092 on #B88563 1.84:1 Fail
Aa #B88563 on #80596F 1.84:1 Fail
Aa #B88563 on #91554A 1.82:1 Fail
Aa #F7E5C8 on #D9A470 1.79:1 Fail
Aa #E0C092 on #90A05E 1.64:1 Fail
Aa #80596F on #C27070 1.63:1 Fail
Aa #91554A on #C27070 1.62:1 Fail
Aa #C27070 on #D9A470 1.62:1 Fail
Aa #91554A on #6E3838 1.58:1 Fail
Aa #6E3838 on #80596F 1.56:1 Fail
Aa #D9A470 on #EAD874 1.53:1 Fail
Aa #6C7D8D on #90A05E 1.49:1 Fail
Aa #6E3838 on #42282E 1.45:1 Fail
Aa #B88563 on #D9A470 1.44:1 Fail
Aa #F7E5C8 on #E0C092 1.40:1 Fail
Aa #80596F on #6C7D8D 1.39:1 Fail
Aa #91554A on #6C7D8D 1.38:1 Fail
Aa #B88563 on #6C7D8D 1.33:1 Fail
Aa #90A05E on #D9A470 1.29:1 Fail
Aa #E0C092 on #D9A470 1.28:1 Fail
Aa #90A05E on #C27070 1.26:1 Fail
Aa #E0C092 on #EAD874 1.20:1 Fail
Aa #6C7D8D on #C27070 1.18:1 Fail
Aa #F7E5C8 on #EAD874 1.17:1 Fail
Aa #B88563 on #90A05E 1.12:1 Fail
Aa #B88563 on #C27070 1.12:1 Fail
Aa #91554A on #80596F 1.01:1 Fail

Similar palettes

#F9ED69 #F08A5D #B83B5E #6A2C70
4 colors
#7D5A50 #B4846C #E5B299 #FCDEC0
4 colors
#FFF8EA #9E7676 #815B5B #594545
4 colors
#2C3639 #3F4E4F #A27B5C #DCD7C9
4 colors
#F67280 #C06C84 #6C5B7B #355C7D
4 colors
#2B2E4A #E84545 #903749 #53354A
4 colors
#E5D9B6 #A4BE7B #5F8D4E #285430
4 colors
#A9907E #F3DEBA #ABC4AA #675D50
4 colors