Petrol Terrace color palette — #EDF6FF · #D9D7EB · #B3BBD5 · #2E6FA3 · #314251

Slate and Ash set the tone — five colors that lean into trust and stability.

The five colors

• Ivory (#EDF6FF): bright and airy, almost weightless.
• Silver (#D9D7EB): A whisper-light, dusty violet — the color of twilight just after sunset.
• Ash (#B3BBD5): A luminous, dusty violet — the color of wild irises.
• Slate (#2E6FA3): A full-bodied, balanced blue — the color of deep harbor water.
• Charcoal (#314251): A deep, shadowed, dusty blue — the color of deep harbor water.

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

Use it as a design system

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

• Weathered Petrol color palette (#EBF3FA, #D7D4E1, #BEBCD2, #0072AB, #132737)
• Dusty Cobalt Loft color palette (#EDF8F4, #EFDADD, #DBBDB7, #008FD2, #2B463D)
• Aged Alley color palette (#F5F4FB, #DED7DC, #B5A9A2, #947598, #535159)
• Antique Navy Harbor color palette (#DBDEE6, #B5B8C8, #8E8BA0, #393B7E, #191F2D)
• Chestnut Boulevard color palette (#E0EDFF, #A1AAD1, #916E92, #755616, #48500F)
• Muted Grape Courtyard color palette (#F4F4FF, #D5CEE7, #AFA0BA, #7B2FA1, #313047)
• Twilit Lapis color palette (#E0E7F5, #4950E0, #252747, #0F172A, #060610)
• Dusty Boulevard color palette (#E5FCEA, #A8A769, #5A732C, #21586E, #3F3D01)

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