Petrol Courtyard color palette — #F8F5EF · #CAE6E9 · #7D9BC5 · #297A8D · #5F4B5A

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

The five colors

• Ivory (#F8F5EF): a clean, paper-quiet neutral.
• Silver (#CAE6E9): A whisper-light, dusty blue — the color of a favorite pair of jeans.
• Blue Fog (#7D9BC5): A luminous, dusty blue — the color of deep harbor water.
• Teal (#297A8D): A full-bodied, balanced blue — the color of open sky before noon.
• Charcoal Brown (#5F4B5A): A full-bodied, dusty pink — the color of peonies in June.

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

• Turquoise Cabin color palette (#F8F4EE, #CBE5DF, #51A7BB, #387D6C, #375146)
• Aged Powder color palette (#FCF2F5, #DBDEED, #9EB0E1, #549391, #4E5165)
• Lilac Grove color palette (#F7F6E7, #A4B984, #AD86CA, #647D39, #65414D)
• Washed Cobalt color palette (#F6F7E5, #80A565, #4D8CD4, #9E6369, #43433C)
• Timeworn Petrol color palette (#FFF4E2, #6EC7D6, #00799A, #00564F, #003754)
• Washed Hollow color palette (#F6EEE1, #449FA3, #005361, #003127, #001721)
• Denim Canyon color palette (#EEE7DC, #6BA6CB, #0058A0, #003D46, #0C1A49)
• Tempered Courtyard color palette (#F6F6E9, #B4E6E0, #8BCCDF, #8A8D60, #4D5301)

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