Petrol Harbor color palette — #F1F3EC · #C2E4E6 · #7DA0C1 · #3E7387 · #432D43

Slate takes the lead with Blue Fog close behind in a set that reads as trust and stability at first glance.

The five colors

• Cream (#F1F3EC): a clean, paper-quiet neutral.
• Silver (#C2E4E6): A whisper-light, dusty blue — the color of open sky before noon.
• Blue Fog (#7DA0C1): A luminous, dusty blue — the color of open sky before noon.
• Slate (#3E7387): A full-bodied, dusty blue — the color of deep harbor water.
• Charcoal (#432D43): A deep, shadowed, dusty pink — the color of neon signs at night.

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

• Timeworn Cypress Archive color palette (#F1F3EB, #C4E3E0, #7CA793, #39767D, #233C33)
• Worn Cypress Workshop color palette (#FAF3F6, #D9DDEE, #809AC5, #1D7D83, #49526A)
• Aged Lilac Lagoon color palette (#FFECF2, #AD8BCC, #B57B80, #4F7EA1, #342127)
• Ancient Cabin color palette (#E9EAE0, #7EBFCC, #007791, #004B4D, #001924)
• Muted Delta color palette (#E0E4D7, #78A895, #005D8F, #003745, #000B1B)
• Wandering Iris Harbor color palette (#FFEBF8, #B4B0E5, #8978B6, #675382, #4A2D37)
• Tempered Pewter color palette (#FFECF3, #BAA9DE, #5DAAB0, #7965A1, #1D3822)
• Cerulean Bloom color palette (#F2F3E3, #B7DABB, #0093A4, #00635C, #002A34)

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