Tempered Pine color palette — #F4F6EF · #A3CCAE · #647BB3 · #387E51 · #362933

Teal and Slate set the tone — five colors that lean into nature and growth.

The five colors

• Ivory (#F4F6EF): bright and airy, almost weightless.
• Pistachio (#A3CCAE): A luminous, dusty teal — the color of shallow lagoons.
• Slate (#647BB3): A full-bodied, balanced violet — the color of wild irises.
• Teal (#387E51): A full-bodied, balanced teal — the color of shallow lagoons.
• Onyx (#362933): A deep, shadowed, dusty pink — the color of neon signs at night.

Feels like: Nature, Growth, Creativity, Sophistication. Tagged duotone, muted.

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

• Timeworn Summit color palette (#F7F5EE, #C5C394, #46879E, #747029, #203229)
• Tempered Cypress color palette (#EBF4F5, #9BCED5, #2990A9, #008473, #061821)
• Muted Ridge color palette (#F3F6F1, #C1DAB5, #4DA9C5, #00A38D, #23322A)
• Pewter Lagoon color palette (#F0F7F3, #72BBD1, #935882, #006B82, #331D1E)
• Petrol Archive color palette (#FFF2EA, #6FB7AB, #4C7DA0, #794C3A, #384E3D)
• Aged Dune color palette (#EDFCD1, #86CCC9, #458A9C, #2A638E, #36437E)
• Quiet Coast color palette (#EEF9E8, #00BCA1, #654CBD, #006555, #2E1222)
• Wandering Aubergine Delta color palette (#E6F4EA, #008597, #510095, #003941, #0C0004)

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