Petrol Harbor color palette — #ECF8F4 · #F0D9DF · #D1B1C5 · #1971A5 · #31453E

Slate and Rosewood Mist set the tone — five colors that lean into trust and stability.

The five colors

• Ivory (#ECF8F4): a clean, paper-quiet neutral.
• Shell Pink (#F0D9DF): A whisper-light, dusty rose — the color of pressed rose petals.
• Rosewood Mist (#D1B1C5): A luminous, dusty pink — the color of neon signs at night.
• Slate (#1971A5): A full-bodied, balanced blue — the color of a favorite pair of jeans.
• Charcoal (#31453E): A deep, shadowed, dusty teal — the color of sea glass.

Feels like: Trust, Stability, Sophistication. Tagged scandi, muted, light.

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

• Muted Cerulean Coast color palette (#ECF7FF, #DAD7E9, #C8B9CE, #3491BC, #34424B)
• Tempered Petrol color palette (#E9F5F0, #F5D6DC, #D6B5BF, #05759D, #182922)
• Patina Indigo color palette (#FBF2F7, #E9D5D2, #D3B2B6, #695CAB, #4A3B43)
• Denim Chapel color palette (#F3ECF3, #D8C6D3, #BB93A7, #1B5691, #352937)
• Patina Cypress Courtyard color palette (#F1F7F1, #CADFDC, #97C9B5, #007A78, #364435)
• Driftwood Parlor color palette (#FBF3F4, #E3D8D3, #ABAFA2, #92769B, #575052)
• Driftwood Villa color palette (#EFF6FF, #ADA6E9, #93659F, #795400, #4F5223)
• Olive Quarry color palette (#FFF3E2, #B0A64C, #5F7300, #005A71, #3D3A34)

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