Petrol Pier color palette — #DFE7E2 · #8FA6A5 · #6C9193 · #007081 · #020C05

Teal and Storm Blue set the tone — five colors that lean into trust and stability.

The five colors

• Parchment (#DFE7E2): bright and airy, almost weightless.
• Taupe (#8FA6A5): A luminous, dusty teal — the color of sea glass.
• Storm Blue (#6C9193): A luminous, dusty blue — the color of open sky before noon.
• Teal (#007081): A full-bodied, balanced blue — the color of deep harbor water.
• Ink (#020C05): A deep, shadowed, dusty teal — the color of shallow lagoons.

Feels like: Trust, Stability, Sophistication. Tagged scandi, muted, light.

Use it as a design system

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

• Antique Petrol color palette (#D4E5E0, #B49FA6, #A5838A, #24689B, #000D09)
• Wandering Grove color palette (#D9E2DB, #90ACA0, #927F90, #004F56, #040C05)
• Pewter Courtyard color palette (#DBE4DC, #7E938B, #7F5F75, #003133, #000200)
• Ancient Aubergine Loft color palette (#E0E5D3, #0086AB, #005D9B, #571867, #000408)
• Weathered Emerald Delta color palette (#F0F1DF, #479E52, #007544, #185345, #000901)
• Muted Cornflower color palette (#D4E5DC, #00B5CE, #5A8BDA, #007BDF, #000306)
• Washed Nightshade color palette (#DAF5E8, #007DA2, #493BBC, #1D4100, #000202)
• Cobalt Balcony color palette (#F0E6EF, #D1B9BE, #C59CA1, #4B80CC, #281A28)

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