Petrol Coast color palette — #F1E7DF · #8EC0AD · #406BA9 · #004B4E · #110C3C

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

The five colors

• Parchment (#F1E7DF): bright and airy, almost weightless.
• Mint Leaf (#8EC0AD): A luminous, dusty teal — the color of glacier melt.
• Slate (#406BA9): A full-bodied, balanced blue — the color of a favorite pair of jeans.
• Forest (#004B4E): A deep, shadowed, dusty teal — the color of shallow lagoons.
• Deep Indigo (#110C3C): A deep, shadowed, balanced violet — the color of wild irises.

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

Use it as a design system

One click turns Petrol Coast 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 Petrol color palette (#F4E6DE, #9FBCA0, #00788F, #004E30, #001828)
• Cobalt Veranda color palette (#FBEFE6, #7CC6EA, #0072CF, #005151, #0F0552)
• Wandering Veranda color palette (#EDF0E6, #8DBDAC, #0E6DAB, #004D61, #0C2E53)
• Denim Grove color palette (#F6E9E3, #65AAAC, #006278, #003B26, #000C18)
• Weathered Cerulean Veranda color palette (#FFEEE6, #B6DABD, #0090B9, #00654C, #002646)
• Patina Hollow color palette (#EAF9F8, #D4DBF8, #4598DC, #006681, #001E41)
• Lilac Alley color palette (#D2F7EB, #BFCCFF, #B684BA, #006268, #2B1429)
• Sunlit Cobalt Alley color palette (#C5E8DB, #0088C7, #9A5900, #004B71, #1E0D00)

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