Tempered Pine color palette — #F8F3F9 · #D4D6ED · #779FB9 · #3D7E53 · #445469

Fern and Blue Fog set the tone — five colors that lean into nature and growth.

The five colors

• Ivory (#F8F3F9): a clean, paper-quiet neutral.
• Silver (#D4D6ED): A whisper-light, dusty violet — the color of wild irises.
• Blue Fog (#779FB9): A luminous, dusty blue — the color of a favorite pair of jeans.
• Fern (#3D7E53): A full-bodied, balanced teal — the color of sea glass.
• Peacock (#445469): A full-bodied, dusty blue — the color of open sky before noon.

Feels like: Nature, Growth, Sophistication. Tagged coastal, cool, light, 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

• Aged Aqua Lagoon color palette (#F1F7F2, #D1E1F2, #61C1D4, #5A9481, #425662)
• Tempered Courtyard color palette (#F5F1EB, #C6E4DC, #4EABBD, #407767, #253C31)
• Hushed Cerulean Field color palette (#E8F8FF, #A3CFE7, #3C8C9E, #00586C, #00414D)
• Timeworn Spruce color palette (#E5DBE7, #6BACAB, #00617A, #004214, #001F40)
• Aged Corridor color palette (#E9F8FD, #85B9C9, #C48680, #008385, #6B3F3B)
• Antique Studio color palette (#F5EAF3, #428D98, #004160, #002415, #010030)
• Soft Cobalt color palette (#FCF2F8, #ABD5EC, #2A84CE, #006953, #323779)
• Tempered Powder color palette (#FCF3F0, #C0E3E8, #98D0E8, #9FA780, #5C4D5D)

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