Tempered Petrol Grove color palette — #E5F3E8 · #85B8DA · #316AA9 · #004E5A · #1C2A56

A conversation between Slate and Navy, giving this palette its sense of trust and stability.

The five colors

• Cream (#E5F3E8): A whisper-light, dusty teal — the color of sea glass.
• Sky (#85B8DA): A luminous, dusty blue — the color of deep harbor water.
• Slate (#316AA9): A full-bodied, balanced blue — the color of open sky before noon.
• Deep Teal (#004E5A): A deep, shadowed, dusty blue — the color of a favorite pair of jeans.
• Navy (#1C2A56): A deep, shadowed, balanced violet — the color of a velvet chair.

Feels like: Trust, Stability, Creativity, Calm, Balance. Tagged coastal, cool, light, muted.

Use it as a design system

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

• Petrol Coast color palette (#E5F3E7, #7DBFBF, #007585, #00523F, #003344)
• Hushed Cobalt Orchard color palette (#F0F8F1, #ACC8E5, #5876B6, #005C75, #34375B)
• Washed Orchard color palette (#EFE6EA, #8CBAD7, #4165BD, #004C48, #1A0838)
• Patina Thicket color palette (#E7F3FF, #BDC9F3, #AD94CF, #006B8D, #233854)
• Periwinkle Atelier color palette (#F3EEE5, #AEE0CE, #59A7FF, #008EA3, #1F2B50)
• Aged Cerulean Corridor color palette (#E0EAE1, #419CB9, #004F73, #003031, #00142C)
• Linen Denim color palette (#D0E6FF, #5D98ED, #0553AA, #002A5C, #001336)
• Muted Summit color palette (#F0F7F1, #BFE3F3, #5D93A9, #087169, #2B4B65)

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