Tempered Petrol color palette — #F5F1EA · #C3E7E9 · #7F9FC5 · #347583 · #432E3F

Teal takes the lead with Blue Fog close behind in a set that reads as trust and stability at first glance.

The five colors

• Cream (#F5F1EA): a clean, paper-quiet neutral.
• Silver (#C3E7E9): A whisper-light, dusty blue — the color of a favorite pair of jeans.
• Blue Fog (#7F9FC5): A luminous, dusty blue — the color of open sky before noon.
• Teal (#347583): A full-bodied, dusty blue — the color of deep harbor water.
• Espresso (#432E3F): A deep, shadowed, dusty pink — the color of peonies in June.

Feels like: Trust, Stability, Sophistication. 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

• Softworn Petrol Studio color palette (#E2F7F0, #87BAE1, #C39064, #3B78A2, #35302B)
• Softworn Quarry color palette (#FAF3F6, #D9DEEF, #859ABC, #267D79, #4B506E)
• Cypress Delta color palette (#F6F1EA, #C7E4DA, #82A78A, #3C7960, #253C30)
• Hushed Driftwood Lagoon color palette (#DBFAF1, #76A0CB, #B97883, #6C8154, #142D27)
• Washed Denim color palette (#F9EFDF, #76A3BC, #005B99, #00383F, #00042D)
• Ancient Petrol color palette (#F0E8DB, #82BFCA, #007697, #004C46, #001829)
• Softworn Cerulean color palette (#F9F1E4, #99DEE1, #0092AB, #006452, #002939)
• Washed Ash color palette (#FCECFD, #EAD1D4, #DDB4B0, #739D89, #433442)

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