Petrol Drift color palette — #D3EFF3 · #00758A · #004B69 · #002A45 · #00061A

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

The five colors

• Frost (#D3EFF3): A whisper-light, dusty blue — the color of deep harbor water.
• Teal (#00758A): A full-bodied, balanced blue — the color of open sky before noon.
• Navy (#004B69): A deep, shadowed, balanced blue — the color of deep harbor water.
• Midnight (#002A45): A deep, shadowed, dusty blue — the color of open sky before noon.
• Ink (#00061A): A deep, shadowed, dusty blue — the color of open sky before noon.

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

Use it as a design system

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

• Deep Delta color palette (#CFE7E4, #006271, #003547, #001637, #040022)
• Weathered Corridor color palette (#D0E9EB, #008097, #004B69, #001424, #000105)
• Petrol Thicket color palette (#D6ECFF, #0070A4, #844500, #003C5B, #0D0300)
• Tempered Cypress Pier color palette (#C9ECD8, #008568, #00564E, #003233, #000709)
• Chalky Dune color palette (#CFE5FB, #8AA0D3, #8D6FB9, #005B74, #000927)
• Hushed Navy Boulevard color palette (#C2E8E2, #00889D, #006587, #033196, #070029)
• Quiet Mulberry Drift color palette (#E4F2FF, #005C95, #90003F, #314500, #000205)
• Nightshade Lantern color palette (#E2F2FF, #0066BE, #0022BF, #200077, #090024)

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