Tempered Petrol color palette — #F9EBE4 · #7FC3D3 · #006F9F · #003F35 · #00020C

A conversation between Peacock and Sky, giving this palette its sense of trust and stability.

The five colors

• Cream (#F9EBE4): bright and airy, almost weightless.
• Sky (#7FC3D3): A luminous, dusty blue — the color of a favorite pair of jeans.
• Peacock (#006F9F): A full-bodied, balanced blue — the color of deep harbor water.
• Forest (#003F35): A deep, shadowed, dusty teal — the color of shallow lagoons.
• Ink (#00020C): A deep, shadowed, dusty blue — the color of deep harbor water.

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

• Hushed Terrace color palette (#F7ECE0, #94BBDF, #3D59D0, #003D45, #030010)
• Timeworn Cobalt Courtyard color palette (#FEF3EA, #99D5F4, #157ADB, #005151, #070035)
• Lilac Bloom color palette (#DAFAE9, #A5CCF9, #A88AE4, #006762, #000A17)
• Hushed Cerulean Courtyard color palette (#D6EBE8, #67BED3, #0091B4, #006C72, #001722)
• Cerulean Studio color palette (#E6E9D8, #0E9AB5, #005168, #002B2E, #00050A)
• Misty Brick Bloom color palette (#D7F3E3, #008CAB, #B72C00, #004354, #040000)
• Gentle Terracotta color palette (#C7F0FE, #00738D, #9D2700, #673300, #000102)
• Periwinkle Harbor color palette (#FBF3EF, #C2E1ED, #6DADDF, #008076, #1E2D50)

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