Petrol Ridge color palette — #EFF8F0 · #C7E0F4 · #668DBB · #086E7F · #394669

A conversation between Teal and Slate Blue, giving this palette its sense of trust and stability.

The five colors

• Ivory (#EFF8F0): bright and airy, almost weightless.
• Powder Blue (#C7E0F4): A whisper-light, dusty blue — the color of deep harbor water.
• Slate Blue (#668DBB): A luminous, balanced blue — the color of a favorite pair of jeans.
• Teal (#086E7F): A full-bodied, balanced blue — the color of open sky before noon.
• Navy (#394669): A deep, shadowed, dusty violet — the color of wild irises.

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

Use it as a design system

One click turns Petrol Ridge 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

• Washed Iris Workshop color palette (#F7EFF2, #C5E0F6, #758CC3, #006D69, #2F2548)
• Dusty Denim Studio color palette (#DFE8E0, #5BADB7, #006178, #003F37, #002234)
• Wandering Forest Pier color palette (#EEF8F0, #A1CDDA, #2A8694, #00624B, #173F54)
• Aged Abyss color palette (#DCE9DE, #50899D, #004160, #002223, #00091A)
• Softworn Lagoon color palette (#F9F4EF, #C5E4E6, #8CA4D9, #008D87, #603A4D)
• Worn Teal color palette (#E4FAFE, #41B5A4, #BC707D, #007669, #513756)
• Frosted Navy Alley color palette (#DEEAE0, #6F93B7, #1E4297, #002E3C, #0F0341)
• Timeworn Cobalt Boulevard color palette (#E8F1EA, #94B5D4, #3266B6, #004D5E, #232953)

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