Petrol Pier color palette — #D6E2E7 · #AAB0C4 · #9894B8 · #00808E · #05161D

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

The five colors

• Silver (#D6E2E7): bright and airy, almost weightless.
• Ash (#AAB0C4): A luminous, dusty violet — the color of wild irises.
• Blue Fog (#9894B8): A luminous, dusty violet — the color of wild irises.
• Teal (#00808E): A full-bodied, balanced blue — the color of open sky before noon.
• Ink (#05161D): A deep, shadowed, dusty blue — the color of a favorite pair of jeans.

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

• Tempered Petrol color palette (#E2ECF4, #A19EAF, #91829E, #006A9E, #020A13)
• Ancient Denim color palette (#DBE5DF, #9FBCAE, #74A091, #005D6F, #04190D)
• Worn Workshop color palette (#E6E9F3, #C7BBCA, #BD9DB4, #7974C6, #1A1F2D)
• Hushed Lantern color palette (#E7F1E8, #C1D5CE, #BA9CAF, #00585F, #000401)
• Hushed Delta color palette (#EAF2EC, #91A59C, #8C718F, #003E47, #000602)
• Worn Turquoise color palette (#EAF8FF, #D5D9F4, #C3BADC, #00A9CB, #213641)
• Worn Azure color palette (#C8E9ED, #489BDA, #8061AC, #5D5315, #241E00)
• Frosted Ultramarine color palette (#FFE7D2, #009AAA, #355DCF, #683B00, #000D15)

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