Petrol Harbor color palette — #F1FBD2 · #C4D3B4 · #6BA39C · #436A8D · #553750
A conversation between Slate and Eucalyptus, giving this palette its sense of nature and growth.
The five colors
- Custard (#F1FBD2): A whisper-light, dusty green — the color of a quiet forest floor.
- Pistachio (#C4D3B4): A whisper-light, dusty green — the color of a quiet forest floor.
- Eucalyptus (#6BA39C): A luminous, dusty teal — the color of shallow lagoons.
- Slate (#436A8D): A full-bodied, dusty blue — the color of deep harbor water.
- Charcoal (#553750): A deep, shadowed, dusty pink — the color of neon signs at night.
Feels like: Nature, Growth, Trust, Stability, Sophistication. Tagged vintage, retro, muted.
Use it as a design system
One click turns Petrol Harbor 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
- Tempered Petrol Balcony color palette (#FAF8CF, #D5DABE, #73A690, #22708E, #1C4A40)
- Worn Aubergine Market color palette (#D9F6DF, #5A9CB4, #2C6D96, #491E6C, #1A001D)
- Aged Basin color palette (#E8FCE6, #BDE3DB, #9ABCAB, #7C79A8, #603C4A)
- Weathered Taupe Studio color palette (#E1EFE4, #8AA971, #3E8378, #4F4560, #322544)
- Hushed Oat color palette (#F1E8DB, #CEC89C, #94AC86, #9E7A7B, #543837)
- Patina Courtyard color palette (#F5F6EF, #B9E3F0, #50B5D3, #007E83, #003346)
- Grape Studio color palette (#D7FEFF, #7CDDF4, #57A1C8, #6E4EA2, #432151)
- Pewter Alley color palette (#DAFFEF, #C8E3FF, #8AA0DD, #9A5E94, #602D48)
Browse the whole catalog at Explore, or see today's palette.