Tempered Harbor color palette — #FFF1F0 · #DD84AD · #AC6E57 · #705B1B · #3F2E56

A conversation between Bubblegum and Mocha, giving this palette its sense of nature and growth.

The five colors

• Ivory (#FFF1F0): bright and airy, almost weightless.
• Bubblegum (#DD84AD): A luminous, balanced rose — the color of pressed rose petals.
• Mocha (#AC6E57): A full-bodied, balanced orange — the color of autumn markets.
• Coffee (#705B1B): A full-bodied, balanced green — the color of fresh herbs.
• Navy (#3F2E56): A deep, shadowed, dusty violet — the color of twilight just after sunset.

Feels like: Nature, Growth, Optimism, Creativity, Balance. Tagged warm.

Use it as a design system

One click turns Tempered Harbor 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

• Tempered Orchard color palette (#FBF1FE, #FB9AB0, #C57228, #5F6014, #3B1F3C)
• Apricot Orchard color palette (#FFF2EB, #DC8E71, #947F39, #366C35, #542639)
• Wandering Balcony color palette (#F3E0DD, #CC6C8B, #62453D, #3A2926, #201514)
• Wandering Chestnut color palette (#FFF0F7, #8B7FB5, #964C16, #005546, #3C2D60)
• Muted Coral color palette (#FFD1D4, #ED9D9F, #D5776E, #9F5444, #5F3626)
• Tempered Amber Corridor color palette (#FFEFE0, #CA8244, #747716, #6E3671, #530B17)
• Ancient Workshop color palette (#FFE0D4, #FC2C3D, #8F5D00, #404F00, #41003C)
• Patina Bronze color palette (#FFF1ED, #E6BEAA, #BC9D86, #86772D, #555300)

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