Petrol Coast color palette — #F5EDE1 · #8BBEAC · #376AA5 · #004E5B · #1F2B53

Built around Slate, softened by Navy — the whole palette hums with trust and stability.

The five colors

• Cream (#F5EDE1): a clean, paper-quiet neutral.
• Mint Leaf (#8BBEAC): A luminous, dusty teal — the color of shallow lagoons.
• Slate (#376AA5): A full-bodied, balanced blue — the color of a favorite pair of jeans.
• Deep Teal (#004E5B): A deep, shadowed, dusty blue — the color of deep harbor water.
• Navy (#1F2B53): A deep, shadowed, dusty violet — the color of a velvet chair.

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

• Cobalt Drift color palette (#FFF4E2, #89C0DF, #0071BF, #00545E, #0D2A75)
• Washed Petrol Workshop color palette (#F4EEE3, #79C0BC, #007681, #00523B, #003441)
• Timeworn Sapphire Orchard color palette (#F2E7DD, #8DBAD8, #4865B9, #004B49, #1B0738)
• Washed Cerulean Ridge color palette (#FBF4EA, #9FDAE2, #008DAE, #00685C, #004565)
• Lilac Corridor color palette (#FDE8FF, #B4C4F5, #B293D1, #006179, #202E50)
• Cornflower Veranda color palette (#F5ECEF, #9FCAE9, #6381D6, #006C69, #332058)
• Denim Dune color palette (#F4E9D7, #4F9BB5, #004F74, #003031, #00142D)
• Periwinkle Hollow color palette (#E6F2E8, #B3D8F7, #5CA7FF, #008EA4, #1F2B52)

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