Petrol Harbor color palette — #CCF4FF · #6297C0 · #675D9E · #433900 · #1C1E00
Built around Slate, softened by Slate Blue — the whole palette hums with nature and growth.
The five colors
- Frost (#CCF4FF): A whisper-light, dusty blue — the color of deep harbor water.
- Slate Blue (#6297C0): A luminous, balanced blue — the color of open sky before noon.
- Slate (#675D9E): A full-bodied, balanced violet — the color of wild irises.
- Deep Olive (#433900): A deep, shadowed, dusty green — the color of fresh herbs.
- Onyx (#1C1E00): A deep, shadowed, dusty green — the color of new leaves after rain.
Feels like: Nature, Growth, Trust, Stability, Creativity, Balance. 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
- Hushed Pewter color palette (#D8EFFF, #8B90CC, #885083, #354621, #00211C)
- Wandering Thicket color palette (#D7EEDD, #6597A6, #136596, #56311B, #301800)
- Worn Navy color palette (#D4E5EB, #6082B3, #5B3F72, #303400, #031A00)
- Softworn Garden color palette (#CFEEF6, #79ACE7, #8A77A0, #785508, #49380A)
- Washed Periwinkle color palette (#D4E9FB, #6A93D4, #5F6093, #493D56, #502330)
- Wandering Iris color palette (#EFF6FF, #AFBFFD, #8A7DBC, #773D57, #44241B)
- Aged Garnet color palette (#CDE6F9, #695CA1, #632353, #032902, #001005)
- Wandering Petrol color palette (#F2E5EE, #7AC0CD, #00759E, #004D3E, #001531)
Browse the whole catalog at Explore, or see today's palette.