Petrol Garden color palette — #F1EBE0 · #77BECB · #0081A3 · #005A52 · #002236

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

The five colors

• Cream (#F1EBE0): bright and airy, almost weightless.
• Cyan (#77BECB): A luminous, dusty blue — the color of a favorite pair of jeans.
• Cerulean (#0081A3): A full-bodied, balanced blue — the color of a favorite pair of jeans.
• Peacock (#005A52): A full-bodied, dusty teal — the color of shallow lagoons.
• Midnight (#002236): 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 Petrol Garden 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 Villa color palette (#E9E3D9, #84B9DB, #0E75D2, #005765, #0A1553)
• Worn Glacier Field color palette (#ECF9EE, #61E0F5, #0087AB, #00524B, #000E1A)
• Worn Cobalt Loft color palette (#F4EEE4, #A4D0BB, #288ECE, #006B71, #102D55)
• Hushed Denim Study color palette (#EEE2DD, #51AEBC, #005E88, #004029, #0B1A48)
• Pale Azure Meadow color palette (#EBDDE7, #5BD3E5, #109DDC, #008155, #091A4A)
• Wandering Veranda color palette (#F8F5EF, #C5E4E2, #71ADD1, #008C8D, #2C4A69)
• Frosted Mulberry Boulevard color palette (#EDE3CD, #847600, #00758F, #990078, #151200)
• Linen Indigo color palette (#EFE5D2, #9F8400, #625FE2, #635100, #160056)

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