Tempered Pine color palette — #FFF0FE · #6FDFE5 · #009AC8 · #00773D · #033069

Pine takes the lead with Cerulean close behind in a set that reads as nature and growth at first glance.

The five colors

• Blush (#FFF0FE): A whisper-light, dusty pink — the color of neon signs at night.
• Ice Blue (#6FDFE5): A whisper-light, balanced blue — the color of deep harbor water.
• Cerulean (#009AC8): A luminous, balanced blue — the color of open sky before noon.
• Pine (#00773D): A full-bodied, balanced teal — the color of sea glass.
• Navy (#033069): A deep, shadowed, balanced blue — the color of deep harbor water.

Feels like: Nature, Growth, Trust, Stability, Calm, Balance. Tagged coastal, cool, light.

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

• Chalky Meadow color palette (#FFF0F8, #75DAFF, #1B8CF9, #007462, #2C256D)
• Turquoise Studio color palette (#FFF2EC, #BCFCFF, #00AAD1, #007652, #002741)
• Faded Cobalt color palette (#E9DEE6, #64C2CB, #007FAC, #005D35, #041C48)
• Turquoise Basin color palette (#E1FCF6, #83EEF2, #00C0D2, #00998C, #003A45)
• Patina Lagoon color palette (#FAF2F8, #C4ECFF, #6EABDD, #308D70, #3A4863)
• Sunlit Ultramarine Pier color palette (#F7E5EE, #6EABC4, #0065BF, #004B40, #11083A)
• Soft Bronze Loft color palette (#D2FDF5, #72EEDC, #71C4FF, #9B8300, #004230)
• Lime Alley color palette (#EAE2D2, #AAAF00, #568C00, #006546, #003E39)

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