Petrol Quarry color palette — #ECF3F7 · #D3D6DE · #B8BBCB · #3C7F94 · #252D32

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

The five colors

• Ivory (#ECF3F7): a clean, paper-quiet neutral.
• Silver (#D3D6DE): a clean, paper-quiet neutral.
• Ash (#B8BBCB): A luminous, dusty violet — the color of wild irises.
• Slate (#3C7F94): A full-bodied, dusty blue — the color of open sky before noon.
• Onyx (#252D32): a grounded near-black with real depth.

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

Use it as a design system

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

• Patina Cypress color palette (#E9F5F3, #8BBEBD, #488082, #2D5D65, #042E2D)
• Pewter Hollow color palette (#E5EFFF, #B4BCD4, #7B7E95, #624F6A, #3D2A3B)
• Ancient Harbor color palette (#D3E1EB, #94A2AE, #667E99, #003C53, #00050B)
• Cerulean Field color palette (#F0F7F3, #D2DCDC, #B1C5C7, #3B9DB8, #3E4B44)
• Aged Lagoon color palette (#ECF3FA, #C5D6E9, #9AADCA, #006095, #031C2F)
• Aged Terrace color palette (#E6F4FF, #A3EAFF, #7CC8FF, #678DD6, #072237)
• Azure Quarry color palette (#D9F9FA, #64A4CF, #4C6B9F, #61345A, #0F2438)
• Tempered Boulevard color palette (#E4E5F0, #B3B1C0, #9088A4, #59267B, #09081A)

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