Petrol Pier color palette — #EDF6FF · #D7C295 · #3F77A1 · #1E4663 · #19232C

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

The five colors

• Ivory (#EDF6FF): bright and airy, almost weightless.
• Sand (#D7C295): A whisper-light, dusty gold — the color of afternoon light on wheat.
• Slate (#3F77A1): A full-bodied, balanced blue — the color of deep harbor water.
• Navy (#1E4663): A deep, shadowed, dusty blue — the color of deep harbor water.
• Onyx (#19232C): A deep, shadowed, dusty blue — the color of open sky before noon.

Feels like: Trust, Stability, Optimism, Sophistication. Tagged luxury, dark, muted.

Use it as a design system

One click turns Petrol Pier 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 Lagoon color palette (#F2F5FC, #BADBC0, #6D7DA0, #434A71, #272B35)
• Worn Cobalt color palette (#E5FBF4, #FFE2A5, #407CA9, #1C4036, #05130F)
• Patina Drift color palette (#EFF6FF, #D6A184, #2B5283, #172F4C, #1B1B27)
• Worn Grape color palette (#F3F4FF, #DFB453, #7354AB, #442473, #151635)
• Wandering Ash color palette (#FFF0FC, #FFC6B5, #8194C2, #73596F, #271E26)
• Aged Study color palette (#F0F6FD, #A8C6F1, #B875A8, #3C7FDB, #272031)
• Iris Canyon color palette (#F2F5FB, #DDD9E2, #C9BCCB, #8189CC, #434852)
• Worn Bronze Coast color palette (#EFF6FF, #789ADC, #AB603B, #576000, #153039)

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