Tempered Petrol color palette — #ECF4F1 · #E4D5D9 · #D2B5CC · #0D70B2 · #172924

Slate takes the lead with Rosewood Mist close behind in a set that reads as trust and stability at first glance.

The five colors

• Ivory (#ECF4F1): bright and airy, almost weightless.
• Silver (#E4D5D9): bright and airy, almost weightless.
• Rosewood Mist (#D2B5CC): A luminous, dusty pink — the color of peonies in June.
• Slate (#0D70B2): A full-bodied, balanced blue — the color of open sky before noon.
• Onyx (#172924): A deep, shadowed, dusty teal — the color of sea glass.

Feels like: Trust, Stability, Sophistication. Tagged scandi, muted, light.

Use it as a design system

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

• Indigo Courtyard color palette (#F9EEF3, #E7D1CE, #D6B5BD, #6F5DA4, #2D2127)
• Muted Petrol color palette (#EFF6FC, #DAD8ED, #B5BAD8, #0072A4, #314250)
• Weathered Petrol color palette (#EDF4EF, #C6DCDB, #A0CABA, #00788C, #172A1E)
• Denim Coast color palette (#EEE6EE, #D6C6D2, #B49BAB, #275493, #1B131B)
• Patina Azure color palette (#EDF8F4, #E7D3CE, #BEC1B0, #199CDC, #283933)
• Hushed Coast color palette (#E9EAFB, #B6A3D7, #9D65A9, #76403F, #4D2716)
• Eclipse Lapis color palette (#FCE2F5, #4453E8, #271F55, #1E041A, #070107)
• Wandering Terrace color palette (#FFEDE8, #618AF5, #6242C7, #72093C, #141839)

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