Petrol Ridge color palette — #E9F5F0 · #84BCD9 · #C09167 · #007CA8 · #35302B

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

The five colors

• Cream (#E9F5F0): bright and airy, almost weightless.
• Sky (#84BCD9): A luminous, dusty blue — the color of deep harbor water.
• Camel (#C09167): A luminous, balanced gold — the color of old brass.
• Cerulean (#007CA8): A full-bodied, balanced blue — the color of deep harbor water.
• Espresso (#35302B): quiet, heavy and certain.

Feels like: Trust, Stability, Optimism, Sophistication. Tagged muted.

Use it as a design system

One click turns Petrol Ridge 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

• Ancient Amber color palette (#E7FAF3, #7AB8E0, #C88855, #367AA1, #524C46)
• Cypress Corridor color palette (#EBF5E8, #87C0B6, #C8888B, #008476, #48271D)
• Indigo Workshop color palette (#FBEDF5, #ACAFDB, #A1A065, #6765BB, #33312A)
• Muted Cerulean color palette (#EDF7FE, #94CDEA, #DCA46F, #3C97BF, #61434E)
• Wandering Bronze Summit color palette (#DEF9F1, #73A1CD, #B97E4D, #A46834, #0E2E27)
• Sunlit Azure color palette (#DFF9F1, #499EEA, #9F7E00, #005EA0, #2A1F00)
• Hushed Boulevard color palette (#F8EFF5, #CFC39E, #545F89, #41273B, #1B1018)
• Wandering Lagoon color palette (#E4F7EF, #EBD4CC, #E1B29D, #5C9E93, #403140)

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