Tempered Petrol color palette — #EDF0E4 · #94BBAD · #296CA4 · #004C62 · #0C2E55

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

The five colors

• Cream (#EDF0E4): a clean, paper-quiet neutral.
• Sage (#94BBAD): A luminous, dusty teal — the color of sea glass.
• Slate (#296CA4): A full-bodied, balanced blue — the color of open sky before noon.
• Navy (#004C62): A deep, shadowed, dusty blue — the color of open sky before noon.
• Navy (#0C2E55): A deep, shadowed, balanced blue — the color of a favorite pair of jeans.

Feels like: Trust, Stability, Calm, 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 Cypress Boulevard color palette (#EFF0E2, #81BFBA, #00777B, #005144, #00353B)
• Cobalt Dune color palette (#F3E7DC, #82BBE1, #3868BB, #004A4F, #130D38)
• Timeworn Cerulean Drift color palette (#F5F7E9, #B2DABC, #008EA6, #006665, #00475A)
• Gentle Cornflower color palette (#F9EAF0, #A6C9E6, #4582EC, #006B72, #29294D)
• Wandering Denim Alley color palette (#E7EADD, #6F9B84, #00516E, #002F35, #001625)
• Quiet Periwinkle color palette (#E3F2F1, #A7DAFF, #67AAE9, #008BB1, #112E53)
• Antique Petrol color palette (#F4F6F0, #CCE1E3, #7E9CC0, #377795, #61495F)
• Washed Orchard color palette (#EFD6E0, #8E66C7, #007981, #6000A6, #003033)

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