Softworn Basalt color palette — #FDF3EC · #E2DDC2 · #C8A78E · #9D6C61 · #563900

A conversation between Cocoa and Mocha, giving this palette its sense of optimism and sophistication.

The five colors

• Ivory (#FDF3EC): bright and airy, almost weightless.
• Bone (#E2DDC2): A whisper-light, dusty green — the color of new leaves after rain.
• Camel (#C8A78E): A luminous, dusty gold — the color of afternoon light on wheat.
• Mocha (#9D6C61): A full-bodied, dusty orange — the color of sun-warmed clay.
• Cocoa (#563900): A deep, shadowed, dusty gold — the color of honey in a jar.

Feels like: Optimism, Sophistication, Grounding. Tagged earthy, warm, muted.

Use it as a design system

One click turns Softworn Basalt into a complete token system: semantic roles from primary to success, an 11-stop OKLCH scale per role, a WCAG AA/AAA and APCA contrast matrix, an auto-derived dark mode and 11 export formats including CSS custom properties, Tailwind, Figma Variables and shadcn/ui.

Similar palettes

• Patina Pewter Coast color palette (#FFF2EA, #F2D7BF, #C49077, #94584F, #35312B)
• Bronze Harbor color palette (#FFF3E2, #BDB482, #927024, #653B00, #121400)
• Weathered Driftwood color palette (#FFF0F8, #D4ABB9, #9A7287, #6D5567, #3E4C40)
• Tempered Balcony color palette (#EAF9F4, #99CAF0, #D99E8E, #95812D, #223630)
• Aged Driftwood color palette (#FCEDF5, #A8C4A9, #9C758B, #645066, #213028)
• Tempered Cocoa Archive color palette (#FFEAD8, #A97C3D, #753C00, #3F1000, #020100)
• Aged Fern color palette (#EFE5C9, #92A268, #686200, #3F2F00, #010500)
• Muted Olive color palette (#FBF2FA, #A5C2EB, #B87962, #6C6D1C, #1C281B)

Browse the whole catalog at Explore, or see today's palette.