CSS variables
:root {
--c-earthy-1: #553E5B;
--c-earthy-2: #928F8E;
--c-earthy-3: #F8F8D1;
--c-earthy-4: #6D8C4A;
--c-earthy-5: #4A443C;
--c-earthy-6: #342121;
--c-earthy-7: #7B4136;
--c-earthy-8: #443131;
--c-earthy-9: #C59846;
--c-earthy-10: #173C58;
}
About this palette
This 10-color earthy palette runs from Utepils (#F8F8D1) as its lightest tone to Hornblende (#342121) as its darkest. It blends English Violet, Plum Smoke, Utepils, Athonian Camoshade, Earth Black, Hornblende, Aged Teak, Benikeshinezumi Purple, Nattō and Duskwood into a single set you can drop straight into a UI. Of its 45 color pairings, 9 meet the WCAG AA contrast threshold (4.5:1) for body text — the strongest is #F8F8D1 on #342121 at 13.96:1.
Grounded, natural tones — suits sustainability/organic brands, coffee shops, outdoor gear, and warm editorial typography.
Color breakdown
Contrast & accessibility
9 of 45 color pairings meet the WCAG AA contrast threshold (4.5:1) for body text.