CSS variables
:root {
--c-earthy-1: #EFD4B6;
--c-earthy-2: #EBCAA9;
--c-earthy-3: #E1AD97;
--c-earthy-4: #D8BB93;
--c-earthy-5: #D3AB7A;
--c-earthy-6: #AC7437;
--c-earthy-7: #956040;
--c-earthy-8: #623410;
--c-earthy-9: #532B08;
--c-earthy-10: #432408;
}
About this palette
This 10-color earthy palette runs from Sugar Shack (#EFD4B6) as its lightest tone to Chocolate Castle (#432408) as its darkest. It blends Sugar Shack, Almond Biscuit, California Coral, Bowman Beige, Glittering Sun, Enchanting Ginger, Cinnamon Spice, Meatloaf, Brown Study and Chocolate Castle into a single set you can drop straight into a UI. Of its 45 color pairings, 15 meet the WCAG AA contrast threshold (4.5:1) for body text — the strongest is #EFD4B6 on #432408 at 9.88:1.
Grounded, natural tones — suits sustainability/organic brands, coffee shops, outdoor gear, and warm editorial typography.
Color breakdown
Contrast & accessibility
15 of 45 color pairings meet the WCAG AA contrast threshold (4.5:1) for body text.