Tempered Pine color palette — #FFF2EF · #BB6075 · #00865A · #2A528C · #412D29

A conversation between Fern and Mocha, giving this palette its sense of trust and stability.

The five colors

• Ivory (#FFF2EF): bright and airy, almost weightless.
• Mocha (#BB6075): A luminous, balanced red — the color of embers at dusk.
• Fern (#00865A): A full-bodied, balanced teal — the color of sea glass.
• Peacock (#2A528C): A full-bodied, balanced blue — the color of a favorite pair of jeans.
• Espresso (#412D29): A deep, shadowed, dusty orange — the color of sun-warmed clay.

Feels like: Trust, Stability, Balance. Tagged cool.

Use it as a design system

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

• Softworn Pine Garden color palette (#FFF1F5, #9A6AB4, #338441, #005B78, #402D32)
• Frosted Rust color palette (#FFF2EB, #B54F2F, #00743F, #2C397C, #3C261D)
• Washed Rust color palette (#FFF2ED, #C15F5F, #007E99, #624182, #39312E)
• Aged Ridge color palette (#FFF3E4, #A77721, #008376, #3F4D8E, #37322C)
• Bronze Chapel color palette (#FFF3E2, #CB8268, #7A6A00, #3C4A7C, #423C37)
• Weathered Ember Bloom color palette (#FFEBFB, #D8554B, #7B7930, #5A4776, #241421)
• Aubergine Courtyard color palette (#FFF3E7, #A96300, #007386, #6C1290, #3E2507)
• Dusty Coral color palette (#FFF2EC, #EC7668, #919545, #796491, #38312E)

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