Petrol Coast color palette — #F4E3ED · #6BC1DD · #1271AC · #004C46 · #071334
Built around Slate, softened by Cyan — the whole palette hums with trust and stability.
The five colors
- Blush (#F4E3ED): A whisper-light, dusty pink — the color of peonies in June.
- Cyan (#6BC1DD): A luminous, balanced blue — the color of a favorite pair of jeans.
- Slate (#1271AC): A full-bodied, balanced blue — the color of deep harbor water.
- Forest (#004C46): A deep, shadowed, dusty teal — the color of shallow lagoons.
- Midnight (#071334): A deep, shadowed, dusty violet — the color of wild irises.
Feels like: Trust, Stability, Calm, Balance. Tagged coastal, cool, light, muted.
Use it as a design system
One click turns Petrol Coast 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
- Timeworn Cobalt color palette (#FAEEF3, #96D0F0, #4B7EBC, #005B5C, #141F39)
- Softworn Petrol color palette (#F9ECE3, #90BDA5, #1B6BB0, #005141, #262854)
- Hushed Ultramarine Bloom color palette (#EBDEE2, #6CA3CD, #244EB7, #00383E, #0B002C)
- Washed Dune color palette (#FEECF8, #6CE7E0, #0093A7, #006636, #00293B)
- Timeworn Petrol Grove color palette (#F8EFF3, #D7D1E6, #829FBE, #417480, #2B364A)
- Wandering Cerulean Harbor color palette (#F0DFEC, #339AA4, #00516A, #002D20, #00040D)
- Pale Azure Study color palette (#C9F6F8, #79D6DE, #5A9FE1, #4C6530, #002227)
- Soft Navy Corridor color palette (#F3E2E8, #1981B7, #00328A, #001F21, #01000A)
Browse the whole catalog at Explore, or see today's palette.