Tempered Petrol color palette — #F5EDE2 · #93BCAC · #256BAB · #004E58 · #142960

Built around Slate, softened by Navy — the whole palette hums with trust and stability.

The five colors

• Cream (#F5EDE2): bright and airy, almost weightless.
• Sage (#93BCAC): A luminous, dusty teal — the color of shallow lagoons.
• Slate (#256BAB): A full-bodied, balanced blue — the color of a favorite pair of jeans.
• Deep Teal (#004E58): A deep, shadowed, dusty blue — the color of deep harbor water.
• Navy (#142960): A deep, shadowed, balanced violet — the color of twilight just after sunset.

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

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

• Hushed Petrol color palette (#F4EEE4, #9EBA9C, #007683, #00523C, #003442)
• Tempered Cobalt Boulevard color palette (#FAF4EC, #A1D1C3, #5978AE, #005C72, #32375B)
• Sapphire Boulevard color palette (#EFE7E1, #89BBD7, #3566C5, #004C46, #170E31)
• Wandering Lilac Dune color palette (#D4FFF4, #AEBFF3, #9E85CB, #006A82, #203159)
• Wandering Cornflower color palette (#F8EAF0, #96CDEC, #4B81EC, #006D65, #2F2550)
• Antique Cerulean Pier color palette (#D3EBED, #0097B8, #00668C, #004067, #02245F)
• Patina Denim Loft color palette (#F0E7D9, #519BB0, #005070, #00302F, #00152A)
• Faded Periwinkle color palette (#E5F3E8, #A1DCFF, #5EA9F4, #008EA0, #1E2C4E)

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