Petrol Field color palette — #ECF4EE · #C9DFF2 · #708FBA · #0E697C · #212A4A
Peacock and Slate Blue set the tone — five colors that lean into trust and stability.
The five colors
- Cream (#ECF4EE): a clean, paper-quiet neutral.
- Powder Blue (#C9DFF2): A whisper-light, dusty blue — the color of deep harbor water.
- Slate Blue (#708FBA): A luminous, dusty blue — the color of deep harbor water.
- Peacock (#0E697C): A full-bodied, balanced blue — the color of deep harbor water.
- Midnight (#212A4A): A deep, shadowed, dusty violet — the color of a velvet chair.
Feels like: Trust, Stability, Calm, Sophistication. Tagged coastal, cool, light, muted.
Use it as a design system
One click turns Petrol Field 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
- Cobalt Quarry color palette (#DBEEF2, #4AAFCF, #0B7EB2, #1D5588, #192B4F)
- Softworn Cerulean color palette (#E9F3FF, #D8D5E3, #E1B3D1, #448299, #263347)
- Timeworn Ridge color palette (#E7F1E8, #5BAAB7, #00627B, #003A34, #000C17)
- Aged Iris Bloom color palette (#FAF4EE, #C5E4DA, #7287C6, #007170, #5E3B4B)
- Weathered Cerulean color palette (#EBF5EC, #A2D0DE, #28899C, #005D4B, #002432)
- Frosted Petrol Terrace color palette (#E7F3FF, #65AAE4, #B97F4F, #0069A7, #3D1A2A)
- Tempered Abyss color palette (#D6E5D9, #3F829B, #004061, #001F21, #000105)
- Frosted Terrace color palette (#E8F3FF, #4E91D9, #B2656F, #57763C, #0E1F31)
Browse the whole catalog at Explore, or see today's palette.