Petrol Harbor color palette — #EDF4EE · #D8DBEE · #879DBF · #477189 · #2E3649

Built around Slate, softened by Blue Fog — the whole palette hums with sophistication.

The five colors

• Cream (#EDF4EE): bright and airy, almost weightless.
• Silver (#D8DBEE): A whisper-light, dusty violet — the color of wild irises.
• Blue Fog (#879DBF): A luminous, dusty blue — the color of deep harbor water.
• Slate (#477189): A full-bodied, dusty blue — the color of deep harbor water.
• Deep Teal (#2E3649): A deep, shadowed, dusty violet — the color of a velvet chair.

Feels like: Sophistication. Tagged coastal, cool, light, muted.

Use it as a design system

One click turns Petrol Harbor 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

• Denim Hollow color palette (#E7F3E9, #72A2C9, #2C5798, #003744, #050031)
• Worn Petrol color palette (#E1EDE3, #8FBAD2, #0473A4, #004B4C, #001630)
• Cypress Station color palette (#F9F4EF, #CAE6EB, #8E95C7, #007E86, #674853)
• Timeworn Hollow color palette (#E4F6F3, #C5D7F8, #AEB2D6, #678C7D, #2B3F3E)
• Tempered Cypress color palette (#ECF4EE, #BCE4F0, #449CAA, #006F56, #033045)
• Hushed Olive Basin color palette (#E3F7F2, #A2BD90, #AD8FBD, #5B7D41, #302C4C)
• Washed Abyss Orchard color palette (#DFE9E1, #4A8386, #004350, #002019, #000103)
• Cerulean Cabin color palette (#DEF8F4, #82A87A, #6F8EC1, #A06666, #112D29)

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