Tempered Petrol color palette — #F5EAF2 · #7FBEC4 · #0080A4 · #005C44 · #00213C

Cerulean and Pine set the tone — five colors that lean into trust and stability.

The five colors

• Blush (#F5EAF2): bright and airy, almost weightless.
• Ash (#7FBEC4): A luminous, dusty blue — the color of deep harbor water.
• Cerulean (#0080A4): A full-bodied, balanced blue — the color of deep harbor water.
• Pine (#005C44): A full-bodied, balanced teal — the color of shallow lagoons.
• Midnight (#00213C): A deep, shadowed, dusty 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

• Washed Cerulean color palette (#FFF2EC, #76DFE7, #0087A9, #00543C, #000E1C)
• Ancient Cobalt Station color palette (#F4ECF1, #94CFE2, #388EC8, #006D63, #112961)
• Petrol Courtyard color palette (#EBE0E6, #77AABE, #006AAD, #004A46, #040248)
• Turquoise Terrace color palette (#EDEEE0, #4FAFB8, #006271, #003E3B, #00242D)
• Dusty Cerulean color palette (#E0EDEB, #6DD2DB, #00A4BA, #007D78, #00242E)
• Frosted Meadow color palette (#CEDFFF, #C8AFF3, #DE73B1, #00729F, #24193E)
• Ancient Station color palette (#FAF2F8, #CFE0FC, #6BADD6, #008E7B, #344964)
• Violet Quarry color palette (#D7DFFF, #7755E0, #9B5400, #565E00, #130434)

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