Weathered Petrol color palette — #F9F3F9 · #E3D7D8 · #CEBAB7 · #57779B · #4D454D

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

The five colors

• Ivory (#F9F3F9): bright and airy, almost weightless.
• Silver (#E3D7D8): bright and airy, almost weightless.
• Stone (#CEBAB7): A luminous, dusty orange — the color of toasted spice.
• Slate (#57779B): A full-bodied, dusty blue — the color of open sky before noon.
• Charcoal (#4D454D): quiet, heavy and certain.

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

Use it as a design system

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

• Softworn Cobalt Orchard color palette (#EEF2F8, #D7D6DE, #BEBAC7, #4F75B0, #242D38)
• Pewter Boulevard color palette (#FCF2F4, #E2D7CF, #C5ADA4, #7B5479, #453638)
• Muted Workshop color palette (#D5F6EA, #C0A8B8, #9A757A, #696417, #3A5246)
• Indigo Basin color palette (#EFDFE8, #6865B8, #422A30, #291923, #13090D)
• Ultramarine Atelier color palette (#FBF2F8, #E3CBD4, #BF9DA0, #434BB3, #412A3B)
• Hushed Basalt Orchard color palette (#FCF4E8, #B1B385, #607D53, #6C5061, #504100)
• Garnet Lantern color palette (#E6DDDD, #C4B5B1, #9E897D, #6F2059, #2C191A)
• Azure Boulevard color palette (#F9F6E2, #629DD0, #755B96, #47541E, #4B3547)

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