Petrol Pier color palette — #F4EEE4 · #93BDA3 · #007299 · #00504D · #08304E

Peacock takes the lead with Deep Teal close behind in a set that reads as nature and growth at first glance.

The five colors

• Cream (#F4EEE4): bright and airy, almost weightless.
• Sage (#93BDA3): A luminous, dusty teal — the color of sea glass.
• Peacock (#007299): A full-bodied, balanced blue — the color of deep harbor water.
• Forest (#00504D): A deep, shadowed, dusty teal — the color of glacier melt.
• Deep Teal (#08304E): A deep, shadowed, dusty blue — the color of a favorite pair of jeans.

Feels like: Nature, Growth, Trust, Stability, Calm, Sophistication. Tagged coastal, cool, light, 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

• Sapphire Garden color palette (#F4EDE3, #85B7E0, #2E65BA, #004D5E, #222857)
• Cobalt Dune color palette (#F9F4EE, #A6D0BC, #057FC0, #005F65, #4A2F4B)
• Turquoise Quarry color palette (#E5F2F0, #AEDBF1, #00B5E4, #008F99, #003248)
• Lagoon Delta color palette (#F8EDDD, #4C9EA2, #005362, #003127, #001721)
• Azure Ridge color palette (#E9FAD7, #75D3CF, #00A4CB, #34642E, #2A3E25)
• Emerald Lagoon color palette (#D9E5CB, #439D38, #00703B, #004B36, #00322B)
• Wandering Azure color palette (#F8F5EF, #CAE5E3, #60A1CA, #307C7D, #5D4C5F)
• Timeworn Harbor color palette (#D9E2C9, #26A671, #9D0086, #005737, #421339)

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