Tempered Petrol color palette — #F7EAF0 · #87B9D4 · #3F66AC · #005049 · #2E264F

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

The five colors

• Blush (#F7EAF0): bright and airy, almost weightless.
• Sky (#87B9D4): A luminous, dusty blue — the color of open sky before noon.
• Slate (#3F66AC): A full-bodied, balanced violet — the color of wild irises.
• Forest (#005049): A deep, shadowed, dusty teal — the color of glacier melt.
• Deep Indigo (#2E264F): A deep, shadowed, dusty violet — the color of wild irises.

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

• Cobalt Basin color palette (#FEF1F5, #A6CAE8, #6074B5, #00605F, #40315C)
• Hushed Pier color palette (#EFE8DD, #8CBBD4, #1B6FB1, #004A52, #02113C)
• Worn Forest Cabin color palette (#F3EBF4, #78C0BB, #00748B, #0E5408, #003052)
• Faded Forest Station color palette (#FDF1FB, #96DDE0, #008CB5, #006B34, #193F72)
• Weathered Delta color palette (#F4E3EE, #5D9AAA, #004D7C, #003123, #0A0A3C)
• Softworn Cypress Chapel color palette (#FBF2F6, #D9DEEF, #8899C0, #3D7B77, #4D5167)
• Pewter Lantern color palette (#F8EBFF, #F7BDAB, #A09A5B, #724989, #452C47)
• Ancient Periwinkle color palette (#F5EDE5, #AFE0CA, #67A5FF, #009283, #2C2751)

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