Petrol Courtyard color palette — #F1F3EB · #C4E2E4 · #7CA1C0 · #3C7486 · #422E44

Slate takes the lead with Blue Fog close behind in a set that reads as trust and stability at first glance.

The five colors

• Cream (#F1F3EB): bright and airy, almost weightless.
• Silver (#C4E2E4): A whisper-light, dusty blue — the color of deep harbor water.
• Blue Fog (#7CA1C0): A luminous, dusty blue — the color of a favorite pair of jeans.
• Slate (#3C7486): A full-bodied, dusty blue — the color of a favorite pair of jeans.
• Charcoal (#422E44): A deep, shadowed, dusty pink — the color of neon signs at night.

Feels like: Trust, Stability, Sophistication. Tagged coastal, cool, light, muted.

Use it as a design system

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

• Wandering Cypress color palette (#FAF3F6, #D9DEEF, #7F9BC2, #107E82, #46526F)
• Aged Pier color palette (#F2F2EB, #C7E1D8, #87A58B, #3A786B, #243D2C)
• Denim Veranda color palette (#E2E5D7, #6AA5C1, #005F89, #003843, #000C19)
• Antique Periwinkle color palette (#FFEDEC, #D6A1B9, #769FD1, #975C79, #3D283F)
• Patina Petrol color palette (#E9EADF, #99BEA3, #00788E, #004B4B, #001923)
• Navy Thicket color palette (#DFE6D3, #4C7DA9, #003A76, #001D2B, #00000A)
• Cerulean Basin color palette (#F3F3E2, #8DE0E1, #0094A0, #006359, #002B32)
• Aged Pewter color palette (#FFEDEA, #C48998, #AB855C, #7D6EA4, #36211E)

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