Tempered Cocoa color palette — #FFF1F1 · #EED5C6 · #C9AFA1 · #8E728D · #69424A
A conversation between Cocoa and Slate, giving this palette its sense of sophistication.
The five colors
- Ivory (#FFF1F1): a clean, paper-quiet neutral.
- Bone (#EED5C6): A whisper-light, dusty gold — the color of old brass.
- Rosewood Mist (#C9AFA1): A luminous, dusty gold — the color of old brass.
- Slate (#8E728D): A full-bodied, dusty pink — the color of neon signs at night.
- Cocoa (#69424A): A full-bodied, dusty red — the color of late-summer berries.
Feels like: Sophistication. Tagged vintage, retro, muted, light.
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
- Driftwood Study color palette (#FFF0F8, #F5D3C4, #CCAB97, #5E8374, #365549)
- Softworn Garnet color palette (#FFF1F1, #FDDCAC, #89B083, #8F5B76, #5F2647)
- Worn Lagoon color palette (#F6EDFF, #CFA8C0, #668D78, #56637B, #4C4761)
- Softworn Mulberry color palette (#FFEAE2, #D9AF88, #7A8E5A, #813E5A, #4F171A)
- Timeworn Meadow color palette (#FEE8D4, #BBA283, #647A50, #6D1D4F, #2D1600)
- Muted Bronze Grove color palette (#FFE1D0, #D5A983, #9C803A, #4A6353, #1A3B33)
- Dusty Courtyard color palette (#FCE8F9, #B7828D, #75562B, #322260, #110010)
- Hushed Hollow color palette (#F7F6EA, #C3E9CF, #57AEAE, #8F6881, #2F3F00)
Browse the whole catalog at Explore, or see today's palette.