Petrol Coast color palette — #CFEFFF · #2776AC · #28427D · #3C1B3A · #30020A
Built around Slate, softened by Navy — the whole palette hums with trust and stability.
The five colors
- Frost (#CFEFFF): A whisper-light, dusty blue — the color of a favorite pair of jeans.
- Slate (#2776AC): A full-bodied, balanced blue — the color of a favorite pair of jeans.
- Navy (#28427D): A deep, shadowed, balanced violet — the color of wild irises.
- Deep Indigo (#3C1B3A): A deep, shadowed, dusty pink — the color of a candy shop window.
- Ink (#30020A): A deep, shadowed, dusty red — the color of a theater curtain.
Feels like: Trust, Stability, Creativity, Calm, Balance. Tagged vintage, retro, muted, cool.
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
- Muted Lantern color palette (#C3E9EE, #2E6F9B, #38416E, #430E07, #140700)
- Tempered Petrol color palette (#D5F4F5, #008398, #024B6B, #30244D, #2B0D35)
- Feathered Atelier color palette (#EBEEFF, #7D6AAE, #613377, #4B171C, #330600)
- Softworn Orchard color palette (#D6E6E9, #428FBC, #515797, #652920, #331A00)
- Cobalt Station color palette (#DBF1FE, #0075B1, #003E6B, #00234F, #000943)
- Aged Ultramarine color palette (#D4E5FD, #005BBB, #005B36, #002A5E, #001408)
- Periwinkle Boulevard color palette (#DAEBF9, #75A1E6, #6370AF, #6A3A59, #5E201B)
- Lagoon Courtyard color palette (#E2F3EF, #16A3A1, #005459, #003129, #00181C)
Browse the whole catalog at Explore, or see today's palette.