Petrol Courtyard color palette — #F1F5FD · #DFD5E5 · #B6AFC4 · #58608B · #353B47

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

The five colors

• Ivory (#F1F5FD): a clean, paper-quiet neutral.
• Silver (#DFD5E5): A whisper-light, dusty violet — the color of twilight just after sunset.
• Ash (#B6AFC4): A luminous, dusty violet — the color of a velvet chair.
• Slate (#58608B): A full-bodied, dusty violet — the color of wild irises.
• Charcoal (#353B47): A deep, shadowed, dusty violet — the color of a velvet chair.

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

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

• Dusty Parlor color palette (#FAF3F8, #E3D6D4, #CABBB1, #6F7CB7, #443540)
• Tempered Ash color palette (#D0E2FF, #B89CC3, #7F6A88, #325F63, #1F455A)
• Aubergine Harbor color palette (#F5F3FF, #D9CDE3, #B59EB4, #7F368E, #332F46)
• Dusty Aubergine Dune color palette (#DFDFE8, #ADA4BC, #8A788D, #492065, #13121F)
• Cypress Dune color palette (#E6FBF0, #86A673, #2B7251, #484767, #1B3C36)
• Hushed Lilac color palette (#F3F4FF, #8FC2FF, #AC8DEE, #B55F70, #3C2242)
• Cornflower Delta color palette (#D1F8F2, #637BE8, #82397E, #224B1D, #2A2E46)
• Grape Pier color palette (#DFE0F4, #8526C3, #2B2038, #121121, #050308)

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