Tempered Cocoa color palette — #FFF5D9 · #C3C4AE · #87927B · #7F6977 · #664942
A conversation between Coffee and Custard, giving this palette its sense of sophistication.
The five colors
- Custard (#FFF5D9): A whisper-light, dusty green — the color of new leaves after rain.
- Stone (#C3C4AE): A luminous, dusty green — the color of fresh herbs.
- Eucalyptus (#87927B): A luminous, dusty green — the color of a quiet forest floor.
- Pewter (#7F6977): A full-bodied, dusty pink — the color of neon signs at night.
- Coffee (#664942): A full-bodied, dusty orange — the color of sun-warmed clay.
Feels like: Sophistication. Tagged vintage, retro, muted.
Use it as a design system
One click turns Tempered Cocoa 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
- Cocoa Lantern color palette (#EDFADF, #9CB99D, #658B7B, #775A59, #694200)
- Weathered Pewter color palette (#FFF0FB, #E1C9D2, #95AFA6, #887D9A, #644B5F)
- Timeworn Pier color palette (#E5FCEE, #B8E3E9, #A0C5D7, #939CB0, #4F4E5F)
- Hushed Cypress color palette (#F9F4EE, #C9E7E0, #7BA48C, #3C7C6E, #345246)
- Basalt Lagoon color palette (#DAE8D1, #8B9872, #3B7574, #533863, #502327)
- Patina Pine color palette (#F4F7EA, #8DBF91, #B687AE, #4E8054, #693F45)
- Washed Study color palette (#F0FADB, #A4DBBF, #528E6E, #1F5B3F, #303D00)
- Tempered Fern color palette (#F2F9E2, #70A682, #7986BD, #9F6557, #3C4900)
Browse the whole catalog at Explore, or see today's palette.