Petrol Coast color palette — #F5E6DC · #71C0DA · #2B6EAD · #004D3E · #100F37
Slate and Sky set the tone — five colors that lean into trust and stability.
The five colors
- Parchment (#F5E6DC): A whisper-light, dusty gold — the color of afternoon light on wheat.
- Sky (#71C0DA): A luminous, balanced blue — the color of deep harbor water.
- Slate (#2B6EAD): A full-bodied, balanced blue — the color of open sky before noon.
- Forest (#004D3E): A deep, shadowed, dusty teal — the color of sea glass.
- Deep Indigo (#100F37): A deep, shadowed, dusty violet — the color of wild irises.
Feels like: Trust, Stability, Creativity, 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
- Petrol Hollow color palette (#EDF0E3, #85BBCE, #007298, #004E58, #00324C)
- Muted Cobalt Terrace color palette (#F8F0EA, #9ECFE9, #507BC2, #005C54, #321526)
- Nightshade Terrace color palette (#F9ECDE, #66A3D1, #3A4DAB, #003939, #110026)
- Forest Basin color palette (#FFEDE9, #86E3DC, #0092AE, #2D6327, #002744)
- Antique Azure color palette (#EAFAED, #CBE3FF, #289CD8, #00696B, #001E3E)
- Weathered Cerulean color palette (#FCE6DD, #329AA6, #005071, #002E1A, #00011B)
- Sunlit Plum color palette (#F4D9D9, #B80090, #006D65, #005060, #1A0012)
- Washed Ash color palette (#F8F0EB, #C0EDEC, #7F9EC7, #5C7351, #432F3B)
Browse the whole catalog at Explore, or see today's palette.