Petrol Villa color palette — #F3E6DF · #88BCD0 · #2770A7 · #004C47 · #040C44
Slate and Deep Indigo set the tone — five colors that lean into trust and stability.
The five colors
- Parchment (#F3E6DF): a clean, paper-quiet neutral.
- Ash (#88BCD0): A luminous, dusty blue — the color of deep harbor water.
- Slate (#2770A7): A full-bodied, balanced blue — the color of a favorite pair of jeans.
- Forest (#004C47): A deep, shadowed, dusty teal — the color of sea glass.
- Deep Indigo (#040C44): A deep, shadowed, balanced violet — the color of a velvet chair.
Feels like: Trust, Stability, Creativity, Calm, Balance. Tagged coastal, cool, light, muted.
Use it as a design system
One click turns Petrol Villa 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 Study color palette (#EFE7E3, #9DBD9D, #00788E, #004E2F, #001827)
- Petrol Coast color palette (#EDF0E2, #86BACE, #00729A, #004E58, #00314C)
- Softworn Cobalt Meadow color palette (#F6F1EC, #ADD1C2, #4B7DBE, #005B5D, #191C40)
- Weathered Denim Balcony color palette (#F6EEE7, #75A1C9, #3650A4, #003840, #0D002A)
- Weathered Denim Terrace color palette (#F3E2DA, #57959E, #00516C, #002D22, #00040E)
- Washed Coast color palette (#F8F0EC, #CCE4CD, #5598AB, #126F4A, #003529)
- Timeworn Cypress color palette (#F7F0EC, #C8E4E4, #AE90B2, #007B79, #462C40)
- Washed Teal Bloom color palette (#ADF0E0, #21A999, #006A5C, #002D25, #000908)
Browse the whole catalog at Explore, or see today's palette.