Petrol Harbor color palette — #E8F0F6 · #CDD9E6 · #A1BAD9 · #297AA6 · #20303C

Cerulean and Sky set the tone — five colors that lean into trust and stability.

The five colors

• Cream (#E8F0F6): bright and airy, almost weightless.
• Silver (#CDD9E6): A whisper-light, dusty blue — the color of open sky before noon.
• Sky (#A1BAD9): A luminous, dusty blue — the color of deep harbor water.
• Cerulean (#297AA6): A full-bodied, balanced blue — the color of a favorite pair of jeans.
• Deep Teal (#20303C): A deep, shadowed, dusty blue — the color of deep harbor water.

Feels like: Trust, Stability, Sophistication. Tagged scandi, muted, light.

Use it as a design system

One click turns Petrol Harbor 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 Courtyard color palette (#E8EDF3, #BAC5D7, #99A4BF, #2B5FAA, #18202A)
• Azure Lagoon color palette (#E7F1ED, #E1D1D7, #D2B3B8, #369ECC, #20322B)
• Washed Field color palette (#F3F5FD, #DBDCEF, #CDB2DC, #7B63C8, #2E3244)
• Hushed Cypress color palette (#D5E9E9, #5FB89C, #008475, #006265, #003125)
• Patina Archive color palette (#E5EDFF, #B0A1D7, #926EA0, #88464B, #4C3344)
• Linen Indigo Parlor color palette (#EAF4FF, #73CDFF, #69ABFF, #6D79F3, #091F47)
• Patina Byzantium Villa color palette (#D8E2F3, #657AED, #9726A3, #7F0027, #002331)
• Aged Lapis Bloom color palette (#ECD5EF, #5493E9, #5753D3, #7B1A52, #152243)

Browse the whole catalog at Explore, or see today's palette.