Dusty Petrol Pier color palette — #F9EBE5 · #92BDA3 · #216DA6 · #00523E · #222857

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

The five colors

• Cream (#F9EBE5): a clean, paper-quiet neutral.
• Sage (#92BDA3): A luminous, dusty teal — the color of shallow lagoons.
• Slate (#216DA6): A full-bodied, balanced blue — the color of open sky before noon.
• Forest (#00523E): A deep, shadowed, dusty teal — the color of glacier melt.
• Navy (#222857): A deep, shadowed, balanced violet — the color of wild irises.

Feels like: Nature, Growth, Trust, Stability, Creativity, Calm. Tagged coastal, cool, light, muted.

Use it as a design system

One click turns Dusty 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

• Hushed Cobalt Chapel color palette (#FBF4EF, #AECDBE, #4979B9, #006154, #37355B)
• Patina Garden color palette (#F5EDE5, #92B5D6, #535FB3, #004F52, #372051)
• Worn Pier color palette (#E3ECE5, #8EBBD0, #00759C, #004B48, #00172B)
• Muted Cabin color palette (#F9ECE2, #7EA99A, #3650A2, #003E3C, #260B4B)
• Lagoon Bloom color palette (#F7E5E0, #489EA4, #00516C, #003217, #001233)
• Quiet Periwinkle color palette (#F7EAF3, #99E0F1, #4CADF0, #2F9270, #222B4F)
• Muted Amethyst color palette (#EDDBC1, #A17600, #7849C7, #5E4400, #2F1954)
• Weathered Coast color palette (#FAF4F0, #CBE7E5, #7C9CC1, #05816C, #64495A)

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