CSS variables
:root {
--c-earthy-1: #1A1416;
--c-earthy-2: #000000;
--c-earthy-3: #3A4B5D;
--c-earthy-4: #6C7977;
--c-earthy-5: #A63E3C;
--c-earthy-6: #D3892C;
--c-earthy-7: #EEBB43;
--c-earthy-8: #B4B0A7;
--c-earthy-9: #E9E8E2;
}
About this palette
This 9-color earthy palette runs from Thousand Shells (#E9E8E2) as its lightest tone to Black (#000000) as its darkest. It blends Pot Black, Black, Man Friday, Rolling Stone, Bijou Red, Opulent, Golden Glam, Laid Back Grey and Thousand Shells into a single set you can drop straight into a UI. Of its 36 color pairings, 12 meet the WCAG AA contrast threshold (4.5:1) for body text — the strongest is #000000 on #E9E8E2 at 17.11:1.
Grounded, natural tones — suits sustainability/organic brands, coffee shops, outdoor gear, and warm editorial typography.
Color breakdown
Contrast & accessibility
12 of 36 color pairings meet the WCAG AA contrast threshold (4.5:1) for body text.