Petrol Field color palette — #F1F7F2 · #C7E0F5 · #688CBB · #006E81 · #3A466A
Teal and Slate Blue set the tone — five colors that lean into trust and stability.
The five colors
- Ivory (#F1F7F2): a clean, paper-quiet neutral.
- Powder Blue (#C7E0F5): A whisper-light, dusty blue — the color of a favorite pair of jeans.
- Slate Blue (#688CBB): A luminous, balanced blue — the color of open sky before noon.
- Teal (#006E81): A full-bodied, balanced blue — the color of deep harbor water.
- Navy (#3A466A): A full-bodied, 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
- Hushed Cypress Parlor color palette (#F1F7F2, #BEE4EE, #3C99A5, #0D7356, #194F60)
- Muted Iris Alley color palette (#F8EFF2, #C0E1FC, #748BC9, #006D6A, #262945)
- Dusty Denim color palette (#DBE8DE, #63ACB7, #00617A, #003F38, #002235)
- Dusty Periwinkle color palette (#FBF4ED, #C3E6E8, #89A3E2, #1F8B87, #5D3C4C)
- Aged Loft color palette (#E1EEE3, #5D869E, #004161, #002223, #00091B)
- Hushed Chestnut Chapel color palette (#FFF1F6, #C79362, #518FC6, #925500, #14456D)
- Petrol Balcony color palette (#E7F2E9, #99B5D0, #4267A8, #004D5F, #232856)
- Pewter Drift color palette (#E8FCE6, #B27C34, #008D89, #7E5499, #293E28)
Browse the whole catalog at Explore, or see today's palette.